[CSS] un espace apparaît dans certaines conditions
bonjour,
je suppose que mon problème est un grand classique, mais je n'ai pas su trouver les termes pour réussir ma recherche...
j'ai 2 div imbriqués comme ceci:
Code:
1 2 3 4 5 6 7 8 9
|
<div id="en_tete">
<div class="content" >
<h1 id="site_titre">
<img id="logo_site" src="http://127.0.0.1/chak2/image/logo_site.gif" />
Le site des Chakhos
</h1>
</div>
</div |
mon problème vient de l'apparition d'un espace entre le haut de la div "en-tete" et le haut de la div de contenu (class="content")
cet espace correspond à peu près une ligne de texte.
(même phénomène en bas de div)
voilà le css correspondant:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13
|
body {
font-family: Verdana, Arial, Helvetica;
font-size: 80%;
color: #333;
background-color: #CCC;
margin: 0;
padding: 0;
width: 100%;
}
div#en_tete { background-color: transparent; }
div#en_tete .content { background-color: #96F; color: #000; } |
je m'attendais à voir la div en-tête entièrement rempli par la div contenu
là où je ne comprends plus, c'est que si je rajoute ceci dans le css:
Code:
1 2 3
|
/*debugage*/
* {border: 1px solid red } |
le phénomène disparait...
si quelqun avait une solution, voir encore mieux une explcation, je suis preneur
merci