Trois div, milieu à 100%

Bonsoir,

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

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;
}

le résultat:
http://img473.imageshack.us/my.php?image=capture2dn6.png

késako docteur?

++

csseur666 a écrit :

késako docteur?

Hello et bienvenue ici

En fait le comportement observé est exactement le comportement attendu, au vu de ta configuration.

Je te suggère de profiter du week-end pour faire une petite révision du positionnement flottant.
Relis bien l'encart "Attention à bien comprendre le fonctionnement du positionnement flottant", il devrait te faire comprendre ce que tu as mal fait

Salut,

Je fais également deux petites remarques :

* une class dans un div, ça n'a pas de sens
* styliser le code html avec une css suplémentaire, un peu difficile la relecture . Pense à séparer le fond de la forme.

++
Modifié par Nolem (02 Jun 2007 - 10:00)

Nolem a écrit :


* une class dans un div, ça n'a pas de sens

Uh ? Curieuse affirmation

Laurent Denis a écrit :


Uh ? Curieuse affirmation

Je me trompe s'il est préférable d'écrire ceci :
<div id="mon_id"></div>
que ceci :
<div class="ma_class"></div>

Sinon, ceci est mieux ?
<p class="ma_classe"></p>

À moins que l'on veuille ouvrir un bloc qui va se répéter sur la page et le contrôler ?
++
Modifié par Nolem (02 Jun 2007 - 11:57)

a écrit :
Je me trompe s'il est préférable d'écrire ceci :
<div id="mon_id"></div>
que ceci :
<div class="ma_class"></div>

ni l'un ni l'autre ça depand completement du contexte.

quand à transformer un div en p juste parce que j'ai deux div semblables, même s'il n'ont rien avoir avec du texte?

quelle drôle d' idée
Modifié par CPascal (02 Jun 2007 - 12:49)

Raphael a écrit :

Hello et bienvenue ici

En fait le comportement observé est exactement le comportement attendu, au vu de ta configuration.

Je te suggère de profiter du week-end pour faire une petite révision du positionnement flottant.
Relis bien l'encart "Attention à bien comprendre le fonctionnement du positionnement flottant", il devrait te faire comprendre ce que tu as mal fait

je viens d'essayer:

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

<div style="float: left; width: 14px; 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>

tout est sur la même ligne, sauf que l'image du milieu ne va pas jusqu'au 100%, elle n'occupe que 20/30 pixels on dirait

la balise <p> était un exemple.

Tu as raison suivant le contexte. Ce matin, j'étais un peu troll .

++