[Débutant] Mes Div ne se positionnent pas comme je le voudrais

Salut à tous !

Apres avoir monté mes sites en full tableau, j'essaye de me mettre progressivement au CSS et à l'utilisation des div. Malheureusement, ca ne se passe pas comme prévu

Voila mon souci actuel :

Je voudrais mettre 3 div en ligne et répéter ce shéma sur plusieurs ligne pour obtenir le résultat suivant :





Pour ce faire, j'ai utilisé le schéma suivant :

<div>
	<div class="cartouche">
		<div class="gauche"><img src=""></div>
		<div class="centre">texte</div>
		<div class="droite"></div>
	</div>
	<div class="cartouche">
		<div class="gauche"><img src=""></div>
		<div class="centre">texte</div>
		<div class="droite"></div>
	</div>
</div>

avec le css suivant :

.cartouche 	{display:block; width:100%;}
.gauche 	{height:40px; width:28px; float: left;}
.centre 	{height:40px; width:128px; background-image:url('img1.jpg'); background-repeat: repeat-x;float: left; line-height:40px; text-align:right}
.droite 	{height:40px; width:6px; background-image:url('img2.jpg');float: left;}

Voila voila. Mon problème est que la div1, remonte pour se positionner à droite de la div3 de la ligne précédente :





Il faut également noté qu'en appuyant sur F5, tout rentre dans l'ordre

J'avoue ne pas bien comprendre comme le meme code peut donner deux résultats différents !

En vous remerciant par avance pour vos réponses éventuelles,

Blast
Modifié par Blast (05 Nov 2006 - 13:31)

Bonjour,

Des choses inutiles dans ton css... Revoir les modèles de boite
Revoir aussi les propriétés float ... un indice : la propriété clear pour sortir d'un float.

Bon courage