28173 sujets

CSS et mise en forme, CSS3

[résolu]Problème d'affichage de background sur Firefox

Tout d'abord bonjour à tous et merci énormément pour l'aide de qualité que vous avez déjà pu m'apporter par le passé.

J'ai de nouveau un petit problème et malheureusement je n'ai pas mon livre "XHTML et CSS" collection Eyrolles sous la main Smiley smile

Voilà mon problème :
J'ai un bloc qui se constitue de 3 autres blocs disposés en float (technique trouvé sur ce site).
Chacun de ces 3 blocs connaît une image d'arrière plan. Seul le bloc central ne parvient pas à afficher le background et seulement sur Firefox.
C'est également la seule à être affiché en repeat.

J'ai jamais été très clair pour synthétiser aussi je vous mets un lien bien plus parlant ici.

Pour les curieux, il s'agit d'une copie de l'interface graphique de Gmail pour un blog perso Smiley smile
Modifié par Lexarino (04 Jun 2007 - 09:46)
Salut,
<div class="postop">
	<div class="bgh"> </div>
	<div class="toh">
		<p>L'objet du bug !</p>
	</div>
	<div class="bdh"> </div>
</div>

L'objet de ton "bug" n'est pas sur div.toh, mais sur div.postop et div.posbottom (c'est elles qui ont le background que tu voudrais voir et qui ne s'affiche pas).
Il ne s'agit pas d'un bug. Un float sort du flux, par définition. Donc si un élément ne contient que des floats, il ne contient, en quelque sorte, plus rien et prend une hauteur de zéro. C'est ce qui arrive à div.postop et div.posbottom : avec une hauteur de zéro, on ne risque pas de voir leur arrière-plan Smiley smile Tu as plusieurs solutions pour régler ton problème, parmi lesquelles celle de mettre {overflow:auto;} sur les deux div en question. Ça les forcera a prendre la hauteur des floats qu'elles contiennent.

A+
Merci énormément !

Effectivement j'avais déjà lu cette erreur sur le forum auparavant en plus, mais réussi à la comprendre... en même temps voilà ce que c'est de passer un dimanche plonger sur du code : on en devient neuneu Smiley eek

Encore merci Smiley smile
Sujet clos
Aller à