18041 sujets

Questions générales et questions de débutants

Header/2 colonnes/footer

bonjour à tous, je cherche a faire un header/2colonnes/footer et espère que la hauteur de mes tailles soit la même qq soit le contenu (en fait jaimeria que cela soit le max des deux) mais j'arrive pas...



<html>
<head>
<link rel="stylesheet" media="screen" type="text/css" href="style.css" /> 
</head>

<body>

<div id="conteneur">

  <div id="header"></div>
  
  <div id="gauche">Menu<br />test</div>

  <div id="centre">Page</div>
  
  <div id="pied"></div>

</div>

</body>

</html>


et le css



body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
background-color:#5eb5d5;
}
#header {
height: 200px;
background: url("images/templates/banner.jpg");
}
#conteneur {
position: relative;
width: 800px;
margin: 0 auto; 
background-color:#CCCCFF;
}
#centre {
background: url("images/templates/main.jpg");
margin-left: 200px;
}
#gauche {
position: absolute;
left:0;
width: 200px;
background: url("images/templates/menu.jpg");
}
#pied {
height: 45px;
background: url("images/templates/about.jpg");
}
p {margin: 0 0 10px 0;}


Voila en fait j'ai essayé de chercher de laide sur le forum avant de poster et j'ai trouvé le css ci-dessous qui marchait pas snif

à bout de nerf (ca fait plus de 4h que je cherche sans succès) j'espère trouver une solution ici mici encore^^
Modifié par Menencia (08 Oct 2006 - 20:03)
Bonjour Menencia et bienvenue sur ce forum,

Premièrement, toujours travailler avec une déclaration de type de document (doctype) valide, en HTML 4.01 Loose ou Transitional ou Strict, ou en XHTML 1.0 Transitional ou Strict. N'utiliser autre chose que si l'on sait précisément ce que l'on fait.

Deuxièmement, attention aux propriétés du positionnement absolu :
http://openweb.eu.org/articles/initiation_absolue/
Le menu positionné en absolu ne pourra pas repousser le pied de page s'il est plus grand que le bloc de contenu. Si on risque d'avoir un menu un peu long, il faudra travailler avec un bloc flottant plutôt qu'un bloc positionné en absolu.
Justement, dans une même structure (head - 2 colonnes - foot), je pensais utiliser des "float" pour repousser le pied de page mais ceux ci agissent sur le fond (background-image répétée horizontalement) de mon div conteneur et le décalent... Que peut-on faire ?
Sujet clos
Aller à