18041 sujets

Questions générales et questions de débutants

[résolu]Différence Interprétation CSS

Hello à tous,

Je me casse la tête sur un problème.
Quand j'applique une marge supérieure à mon menu celui décale aussi l'arrière plan contenu dans le bloc parent "conteneur".

La où ça m'échappe c'est que ça fonctionne normalement sur IE Smiley sweatdrop

Voici le code : 

<style typy="text/css">

body{
margin:0;
padding:0;
background-attachment:fixed;
background: transparent url(commun/background/strips.png);
}

#conteneur{
width:615px;
height:450px;
margin:0 auto;
padding:0;
background: transparent url(commun/background/topBackground.png) no-repeat;
}

ul#menu{
margin:0 auto 0 auto;
padding:0;
width:573px;
height:28px;
list-style-type:none;
background-color:black;
}

#menu li{
float:left;
}

#menu a{
display:block;
width:90px;
height:28px;
border:0;
text-decoration:none;
text-align:center;
font-family: Arial Black, Arial ;
font-size:14px;
color:ffffff;
}



</style>
</head>

<body>
<div id="conteneur">

<ul id="menu">
<li><a href="index.html" title="Page d'Accueil">Accueil</a></li>
<li><a href="utilisation.html" title="Page d'utilisation">Utilisation</a></li>
<li><a href="telechargement.html" title="Page de téléchargement">Librairie</a></li>
<strong></strong><li><a href="faq.html" title="Page Foire Aux Questions">F.A.Q</a></li>
</ul>


</div>
</body>


Si quelqu'un est inspiré je suis preneur car je sèche sur ce coup.
Merci
Modifié par copperfield (17 Oct 2008 - 23:33)
Bonjour,

Alors très rapidement:
- ça ne fonctionne pas correctement dans IE (même si, visuellement, ça donne ce que tu attends);
- ça fonctionne correctement avec la plupart des navigateurs (même si, visuellement, ça ne donne pas ce que tu attends).

Le phénomène qui joue ici est la fusion des marges.

http://developer.mozilla.org/fr/CSS/Fusion_des_marges (voir le deuxième cas)
http://web.covertprestige.info/test/04-blocs-imbriques-et-fusion-des-marges.html
Merci Florent pour ces liens.
Il y a confusion dans ma tête Smiley lol car je croyais qu'on résolvait ce problème avec des margin à 0.
Je me coucherai moins bête ce soir.

@+
Sujet clos
Aller à