Bonjour :-)
Avant de poser ma question je précise que je ne cherche pas une solution (j’en ai trouvé plusieurs), je cherche seulement une explication pour comprendre le problème.
Donc, quelqu’un pourrait il m’expliquer ce mystère : pourquoi sous FIREFOX 3 dans un exemple aussi simple et basique que celui présenté ci dessous :
1) le paragraphe « pousse » mon div de 50px vers le bas, si je lui attribue un « margin » ? (au lieu que ce soit mon paragraphe qui se décale de 50px par rapport au sommet de mon div)
2) mon div n’est plus poussé vers le bas de 50px si je lui ajoute une bordure (du style => border: 1px solid #FF0000;) ?!!
CODE HTML
<body>
<div id="container">
<p>bla bla bla</p>
</div>
</body>
CODE CSS
#container {
width: 900px;
height: 500px;
}
p {
font: bold 0.8em Arial;
color:#000000;
margin-top:50px;
}
Je précise que sous IE c’est bien le paragraphe qui se décale de 50px par rapport au sommet du div, celui ci restant à sa place.
Merci pour vos lumières :-)
Configuration: Windows XP
Firefox 3.0.7
<p> dans div firefox float left
