28173 sujets

CSS et mise en forme, CSS3

[RESOLU] Problème de positionnement de débutant

Bonjour, je débute dans la mise en page xhtml/css, et je rencontre un problème concernant le positionnement de 2 balises div.

Voici le code xhtml:


<body>
	<div id="container">
		<div id="en_tete">
		</div>
		<div id="menu">
			<div class="element_menu">
				<h3>Menu 1</h3>
					<ul>
					<li><a href="page 1.html">Lien 1</a></li>
					<li><a href="page 2.html">Lien 2</a></li>
					<li><a href="page 3.html">Lien 3</a></li>
					</ul>
			</div>
	   	</div>
	</div>


et le code css:


#container  {
	width: 806px;
	margin: 10px auto;
	padding: 0;
}

#en_tete {
	background: url("images/entete.gif") 0 0 no-repeat;
	height: 206px;
	width: 806px;
}

#menu {
	background: url("images/menu.gif") 0 0 no-repeat;
	width: 806px;
	height: 41px;
	margin: 0;
	padding: 0;
}


J'ai une image en fond pour les div "en_tete" et "menu" donc, sous IE, elles apparaissent collées, c'est ce que je recherche, par contre, sous firefox j'ai un espace assez important entre les deux.

Merci par avance pour votre aide. Smiley smile
Modifié par Beno (05 Apr 2006 - 09:48)
Salut, cela vient à mon avis du H3 qui garde des valeurs de margin et padding non nulles ! Ces valeurs varient d'un navigateur à l'autre ! Voir ici pour les explications Smiley smile
Si tu rajoutes :
h3 {
margin: 0;
padding: 0;
}

Cela devrait s'arranger Smiley ravi
Modifié par Nitram (04 Apr 2006 - 19:27)
Sujet clos
Aller à