[CSS] div et float

Version imprimable

20/12/2005, 11h25
zan001

[CSS] div et float
bonjour,

j'ai un probleme de css,

voila ce que j'ai en gros :
Code:

1 2 3 4 <div id="A"> <div id="B">contenuB</div> <div id="C">contenuC</div> </div>
et la css :
Code:

1 2 3 4 5 6 7 8 9 10 div#A { background-image:url(ihm/fond.jpg); background-repeat:repeat-y; } div#B { float:left; } div#C { float:left; }
sous IE aucun probleme
mais sous firefox, mon fond ne se repete pas, l'image s'affiche une fois et les div B et C s'affichent par dessus independamment de A

voila, si vous avez des idées
merci
20/12/2005, 11h41
siddh

met un width peut etre
20/12/2005, 11h54
zan001

en fait il y a deja un width, au trois div
le pb vient plutot du height. et je ne peux pas fixer la hauteur de A car B peux avoir une hauteur variable.
Et si je ne la fixe pas le fond de A ne se repete pas
20/12/2005, 12h08
siddh

si tu met un height a A, et que B necessite que A soit plus grand, il s'agrandira
20/12/2005, 14h00
zan001

c'est justement la tout le probleme.
ce que tu me dis est efficace pour IE

mais pas pour firefox, j'ai l'impression que de declarer avec un float B et C fait que A ne depend plus de la taille de B
20/12/2005, 14h04
siddh

tu leur a mis des positions absolues ?
ca expliquerais ton probleme

je suis pas sur d'avoir compris
en fait b et c recouvre A c'est normal sous ff
Code:

1 2 3 4 5 <div id="A"> <div id="B">contenuB</div> <div id="C">contenuC</div> <hr/> </div>
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 #A { background-image:url(ihm/fond.jpg); background-repeat:repeat-y; } #B { float:left; } #C { float:left; } hr{ clear:left; visibility;hidden; }
si j'ai compris ton probleme ce sode devrai le resoudre

pas de position absolue.
voila ma page de test :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <style type="text/css" media="screen"> #A { width:900px; height:20px; background-image:url(blog_fond.jpg); background-repeat:repeat-y; } #B { float:left; } #C { float:left; } </style> <title>title</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <div id="A"> <div id="B"> <p>sdgdsfgdsg</p><p>sdgsdggf</p><p>ytruytrutr</p> </div> <div id="C"> <p>sdgdfsgdsfg</p><p> </p><p>fhgngfnnfhgf</p> </div> </div> </body> </html>
y'a pas plus simple... bah firefox ne retaille pas A en fonction du height de B ou C 8O
ou alors float:left; est-il considéré comme un positionnement absolue par ff.
dans ce cas la quelle solution me reste-t-il pour aligner horizontalement B et C ?