Bonjour, je suis en train de créer une interface web, sauf que j'ai un petit problème.

La page est composer en 4 zones :
- zoneBoutons qui prend toute la largeur de la page en haut
- zoneTexte qui sera juste en dessous et qui prendra aussi la largeur de la page
- zoneMilieuGauche et zoneMilieuDroite qui seront sur la même ligne côte à côte

Le problème vient au zoneMilieu, si je met le même heigth aux deux, une est plus grande que l'autre.

Je met width: 25% à l'une et width: 75% à l'autre (sans margin-left pour qu'elles soient collé), la zone de droite est trop grande et se met en dessous .. je suis obligé de réduire et mettre une valeur "batarde" pour à peu près aligner le tout ..

.css :

1. zoneBoutons

{
height: 30px ;
}

1. zoneTexte

{
height: 55px ;
margin-top: 5% ;
border: black 2px solid;

background-image:url("../images/arrierePlan.jpg");

overflow:scroll ;
}

1. zoneMilieuGauche

{
width: 25% ;
height: 270px;
border: black 2px solid;
overflow:scroll ;
float: left ;
position:relative ;

background-image:url("../images/arrierePlan.jpg");

}

1. zoneMilieuDroite

{
border: black 2px solid;
overflow:scroll ;
width: 72.546% ;
height: 270px ;

background-image:url("../images/arrierePlan.jpg");

padding-left: 2% ;
padding-top: 2% ;
float: left ;
position:relative ;
}

Voilà une capture du résultat :
http://img168.imageshack.ck.us/img168/827/capturend.jpg

Merci

"Le problème vient au zoneMilieu, si je met le même heigth aux deux, une est plus grande que l'autre. " -> ça c'est tes padding sur #zoneMilieuDroite qui agrandie le div

Perso, je jouerais avec une petite feinte pour avoir les bloc de la même hauteur, sans devoir se soucier de mettre un height si toute fois ils ont un contenu de même hauteur.
http://bordel.deblan.fr/html4/bob63.html

Luciano

J'avais que ça de rapidement utilisable sous la main (mon blog était ouvert =P)