28173 sujets

CSS et mise en forme, CSS3

Bonjour messieurs dames,

Bon mon problème à moi est super simple, mais je crise depuis deja 1 journée dessus.

J'aimerai aligner 3 blocs dans un conteneur.

<div id="fond">
		
  <div id="gauche2">
	<div id="contenu">
	  XXX
    </div>
	  <div id="droite2"></div></div>
		
					
	</div>


Un bloc fond qui contient mon fond,un bloc gauche2 qui contient le coté gauche qui doit d'appliquer, et le coté droit qui contient le coté droit.

Mon problème est que je n'arrive pas a faire en sorte que le coté droit se fixe une bonne fois pour toute, quand j'entre des informations dans mon conteneur "contenu" le coté "droite2" suit la mouvance.

upload/11533-Image.JPG

Voila mon code CSS:

#contenu {
	padding-left:35px;
	float: left;
	position:relative;
	width: 300;
	height: 0;}

#fond {
	height:133px;
	background: url(images/center.gif);
	background-repeat:repeat-x;}

#droite2 {
	margin-left:558px;
	float: right;
	width:12px;
	height:133px;
	background: url(images/area_right2.gif);
	background-repeat:no-repeat;
	margin-top:0px;}

#gauche2 {
	height:133px;
	background: url(images/area_left2.gif);
	background-repeat:no-repeat;}


Ce que j'aimerai c'est que le bloc contenu, puisse d'étirer en hauteur, et que mes autres blocs, eux ne bougent pas Smiley smile

Merci d'avance pour toutes réponses pouvant m'etre portées.
Modifié par n4rk0o (22 Mar 2007 - 11:17)
Bonjour,

Les flottants se placent d'abord verticalement en fonction du contenu qui les précède, puis vont se caler horizontalement à gauche ou à droite.

Le bloc flottant à droite doit donc être placé avant le contenu dans le code HTML.

Une autre possibilité consiste à utiliser le positionnement absolu.
Florent V. a écrit :

Une autre possibilité consiste à utiliser le positionnement absolu.

Oui ou une marge haute négative.
Remonter un flottant dans le code peut être problématique dans certaine situations
de linéarisation du contenu (css desactivé, naivigateurs texte) si l'odre logique
de lecture du contenu n'est pas respecté.