28173 sujets

CSS et mise en forme, CSS3

Problème avec ma structure design et CSS

Bonjour,

J'ai un gros soucis avec mon style css pour créer la structure de mon site. Avant je travaillais avec la bonne vieille méthode des tables pour faire le design de mon site. J'essaie de me lancer dans le CSS et j'ai du mal de maîtriser pour l'instant. Je n'arrive pas à trouver la solution de mon problème.
Je vous l'expose ci dessous:
http://img216.imageshack.us/img216/1812/schema1ga0.th.gif
Ca c'est à quoi ressemble la structure de mon site pour l'instant.
/* CSS Document */
#boite_titre
{
   border: 1px solid;
   width: 1000px;
   height: 75px;
}
#boite_menu
{
   float: left;
   border: 1px solid;
   margin-left:0px;
   margin-top: 10px;
   width: 175px;
}
#boite_dynamique
{
   border: 1px solid;
   margin-top: 10px;
   margin-left: 185px;
   width: 815px;
}
#boite_pied
{
   border: 1px solid;
   width: 815px;
   height: 20px;
   margin-top: 10px;
}



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<link href="lib/css/test.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="boite_titre">Titre</div>
<div id="boite_menu">
  <p>Mon Menu</p>
  <p>Mon Menu</p>
</div>
  <div id="boite_dynamique">
    <p>Ma page dynamique<br />
    </p>
</div>
<div id="boite_pied">Copyright ici</div>
</body>
</html>


Le problème avec ce que je fais, c'est que je compte placer dans la partie menu, un menu dynamique. Et donc si le menu est trop grand (hauteur) il passe au dessus de ma partie copyright alors que jaimerai qu'il 'pousse' cette partie. http://img216.imageshack.us/img216/5981/schema2wc9.th.gif

Par contre avec ce que j'ai fait pour le moment, dans ma partie dynamique, si elle est plus longue que la normale elle 'pousse' bien la partie copyright (mon menu reste bien en haut).
http://img86.imageshack.us/img86/9747/schema3et0.th.gif

Et donc, là où je voudrai arriver c'est à ce que mon menu soit dynamique:
http://img86.imageshack.us/img86/7426/schema4hl6.th.gif
et que donc ma partie dynamique s'aligne tj à partir du haut (car dans un autre essai la partie dynamique s'alignait en bas!) et que ma partie copyright soit toujours 'poussée'.

Et l'inverse lorsque ma partie dynamique est plus grande, le menu doit s'aligner en haut. Et dans tous les cas ma partie copyright doit rester en bas.
http://img216.imageshack.us/img216/373/schema5qa6.th.gif

Voilà mon problème, j'espère que c'est clair Smiley cligne

Merci pour votre aide.
Modifié par M@X_BE (13 Dec 2007 - 11:07)
bonjour M@X_BE,

ton problème devrait se résoudre avec un clear sur le footer.

#boite_pied

{

   border: 1px solid;

   width: 815px;

   height: 20px;

   margin-top: 10px;

   clear: both;

}
Sujet clos
Aller à