Bonjour,
J'ai actuellement un petit soucis de CSS, j'ai fait un schéma pour expliquer le mieux possible.
http://img520.imageshack.us/img520/3030/schemaum3.jpg
Les gros div représentés par des rectangles arrondis englaube les petits représentés par des rectangles simples.
Donc mon problème se situe dans le div #middle mon div #menu s'arrête avant le div #contenu, j'aimerais que l'espace jaune soit occupé par le div #menu pour qu'il est la même hauteur que le div #contenu
Donc voici le xhtml :
et le CSS :
J'espère être le plus claire possible.
En vous remerciant d'avance.
Modifié par iowa (17 Oct 2007 - 18:01)
J'ai actuellement un petit soucis de CSS, j'ai fait un schéma pour expliquer le mieux possible.
http://img520.imageshack.us/img520/3030/schemaum3.jpg
Les gros div représentés par des rectangles arrondis englaube les petits représentés par des rectangles simples.
Donc mon problème se situe dans le div #middle mon div #menu s'arrête avant le div #contenu, j'aimerais que l'espace jaune soit occupé par le div #menu pour qu'il est la même hauteur que le div #contenu
Donc voici le xhtml :
<div id="site">
<div id="header"></div>
<div id="middle">
<div id="gauche">
<div id="menu">
<img src="images/02.jpg" class="item" />
<img src="images/04.jpg" class="item" />
<img src="images/05.jpg" class="item" />
<img src="images/06.jpg" class="item" />
<img src="images/07.jpg" class="item" />
<img src="images/08.jpg" class="item" />
<img src="images/09.jpg" style="width:258px; height:116px;" />
</div>
</div>
<div id="contenu">
Lorem ipsum....
</div>
</div>
<div id="footer"></div>
</div>
et le CSS :
#header
{
width:890px;
height:203px;
background-image:url(images/01.jpg);
}
#site
{
margin-left: auto;
margin-right: auto;
width:890px;
text-align:left;
height:100%;
}
body
{
margin:0;
text-align:center;
background-color:#775806;
height:100%;
}
#footer
{
background-image:url(images/10.jpg);
width:890px;
height:98px;
clear:both;
}
#middle
{
width:890px;
height:100%;
}
#menu
{
/*float:left;*/
}
#menu img
{
display:block;
}
#menu .item
{
width:258px;
height:43px;
}
#contenu
{
float:left;
width:632px;
background-image:url(images/03.jpg);
min-height:374px;
}
#gauche
{
float:left;
height:100%;
background-image:url(images/blank.jpg);
}
J'espère être le plus claire possible.
En vous remerciant d'avance.
Modifié par iowa (17 Oct 2007 - 18:01)