0
J'ai un problème avec certains CSS. Ceci est mon htmlProblème de dépassement de marge
<body>
<div id="cn">
<div id="hd">
<ul>
<some li's>
</ul>
</div><!-- /#hd -->
<div id="bd">
</div><!-- /#bd -->
<div id="ft">
</div><!-- /#ft -->
</div><!-- /#cn -->
et il est mon CSS:
div#cn {
position: relative;
width: 960px;
margin: 0 auto;
background: #f7f7f7;
}
div#cn > * {
position: relative;
}
div#cn div#hd {
height: 258px;
background: #f7f7f7 url(../img/hd.jpg);
}
div#cn div#hd ul {
margin: 50px 0 0 0;
padding: 0;
list-style-type: none;
}
div#cn div#hd ul li {
float: left;
}
div#cn div#hd ul li a {
display: block;
height: 35px;
padding: 20px 25px 0 25px;
font-weight: bold;
background: pink url(../img/nava.jpg) right 0 no-repeat;
}
Maintenant, la marge est sans incidence sur l'UL, mais la division autour (#hd) dans Firefox. C'est comme si j'avais la marge sur #hd et non sur le ul ... Maintenant ça devient étrange, si je mets une bordure à #hd ça marche! (ou si je pèse un nbsp avant le UL il travaille à)
Comment étrange est-ce? Et quelqu'un peut-il me dire pourquoi cela se passe et comment je peux réparer cela correctement. (il ne veut pas définir une bordure pour le faire fonctionner: P)
Thx pour le lien .inline-bloc ne fonctionne pas sur IE6:/ – meo
N'a pas vous dire que ce problème était un firefox? – graphicdivine