Hello,
Je réalise un site 2 coilonnes + footer. la colonne de gauche est un menu qui comprend une image en bg bottom left, ce qui fait que le menu ne doit pas empiéter sur cette image. Le hic, c'est que cette image et le menu ne sont pas dans le même bloc. le menu est dans un bloc enfant du bloc avec l'image. Je vous mets le code.
En gros, je souhaite savoir comment faire pour que #centre s'agrandisse indifféremment selon le contenu de #menugauche ou #contenu. La, je me doute que ça marche pas étant donné que #menugauche est en absolute, mais j'ai essayé de la virer en mettant le dl en float:left, ben c'est pas mieux.
L'image building.jpg fait 300px de hauteur, donc je pense appliquer un padding-bottom de 300px au bloc du menu pour éviter l'empiètement en cas d'allongement du menu. Mais ça ne règle pas mon problème de l'agrandissement de #centre...
SI vous ne m'aidez pas, au moins, merci de m'avoir lu !
Modifié par kuvett (01 Aug 2005 - 16:26)
Je réalise un site 2 coilonnes + footer. la colonne de gauche est un menu qui comprend une image en bg bottom left, ce qui fait que le menu ne doit pas empiéter sur cette image. Le hic, c'est que cette image et le menu ne sont pas dans le même bloc. le menu est dans un bloc enfant du bloc avec l'image. Je vous mets le code.
<style>
#centre {width:782px;min-height:380px;padding: 0;background:url(img/middle.gif) top left;} * html #centre {height:380px;}
#fondressources, #fondsolutions, #fondtoile {margin: 0 0 0 9px;width:768px;background:#FCF9EB url(img/building.gif) bottom left no-repeat;border-left:1px solid #626366;}
#menugauche {position:absolute;margin: 0;width:172px;z-index:1;border: 1px solid black;}
#menugauche p.controles {width:100%;height:25px;border-top:1px solid #626366;text-align:center;}
#contenu {font-size:85%;width:571px;min-height:375px;margin: 0 0 0 172px;padding: 25px 10px 10px 8px;background:#FFFFFF;border-left:1px solid #626366;} * html #contenu {height:375px;}
</style>
<div id="centre">
<div id="fondressources">
<div id="menugauche">
<p class="controles">Icones de contrôle</p>
<dl>
<dt><h2>RUBRIQUE</h2></dt>
<dd><a href="">Menu 1</a></dd>
<dd><a href="">Menu 2</a></dd>
<dd><a href="">Menu 3</a></dd>
<dd><a href="">Menu 4</a></dd>
<dd><a href="">Menu 5</a></dd>
<dd><a href="">Menu 6</a></dd>
<dd><a href="">Menu 7</a></dd>
</dl>
</div>
<div id="contenu">
</div>
</div>
</div>En gros, je souhaite savoir comment faire pour que #centre s'agrandisse indifféremment selon le contenu de #menugauche ou #contenu. La, je me doute que ça marche pas étant donné que #menugauche est en absolute, mais j'ai essayé de la virer en mettant le dl en float:left, ben c'est pas mieux.
L'image building.jpg fait 300px de hauteur, donc je pense appliquer un padding-bottom de 300px au bloc du menu pour éviter l'empiètement en cas d'allongement du menu. Mais ça ne règle pas mon problème de l'agrandissement de #centre...
SI vous ne m'aidez pas, au moins, merci de m'avoir lu !
Modifié par kuvett (01 Aug 2005 - 16:26)
)
