Ubuntu-fr

ornidonc2

problème de placement xhtml/css

hello,

j'ai un problème avec 3 divs: je voudrais que celui du milieu soit à 100%, malheureusement le troisième passe en-dessous [ohwell]

mon code xhtml:

<div style="margin: 0px; padding: 0px; width: 100%; height: 68px;">

<div style="float: left; width: 14px; height: 58px;" class="wleft"></div>
<div style="height: 58px; margin-left: 14px; margin-right: 388px;" class="wmilieu"></div>
<div style="float: right; width: 388px; height: 68px;" class="wright"></div>

</div>

mon code css:

.wleft {
background-image: url(wtopleft.png);
background-repeat: no-repeat;
background-position: top;
}

.wmilieu {
background-image: url(wmilieu.png);
background-repeat: repeat-x;
background-position: top;
}

.wright {
background-image: url(wright.png);
background-repeat: no-repeat;
background-position: top;
}

(j'ai mis du style dans le xhtml juste pour améliorer la visibilité, la css ne contient que les infos sur les images)
le résultat:
http://img473.imageshack.us/my.php?image=capture2dn6.png

j'ai aussi essayé:

<div style="margin: 0px; padding: 0px; width: 100%; height: 68px;">

<div style="float: left; width: 100%; height: 58px;" class="wleft">
<div style="width: 100%; height: 58px; margin-left: 14px;" class="wmilieu"> </div>
</div>
<div style="float: right; width: 388px; height: 68px;" class="wright"></div>

</div>

mais rien n'y fait, j'ai beau consulter des tutos sur les flottants, positions (absolute/relative), je ne comprends pas. help please

++

leibowitz

Re : problème de placement xhtml/css

Il 'suffit' d'inverser l'ordre dans lequel tu écris tes divs. Le droit d'abord, ensuite le gauche et le milieu pour finir.

<div style="margin: 0px; padding: 0px; width: 100%; height: 68px;">

<div style="float: right; width: 388px; height: 68px;" class="wright"></div>

<div style="float: left; width: 14px; height: 58px;" class="wleft"></div>
<div style="height: 58px; margin-left: 14px; margin-right: 388px;" class="wmilieu"></div>

Ca semble fonctionner d'après mes essais, mais si ca ne marchait pas chez toi n'hésite pas à envoyer le pack du source (html, css, images, ...) je te fixerai ca avec le plus grand plaisir. Ca m'a prit assez longtemps pour tout capter avec ces floating left/right etc. mais j'arrive à me débrouiller maintenant. Un bon livre ca aide aussi :-)