28172 sujets

CSS et mise en forme, CSS3

Decalage avec IE(enlever les espaces)

Bonjour a tous
j'ai crée une page web avec:
-une bannière
-une barre de navigation horizontale
-au dessous deux blocs cote a cote
-et tout en bas le pied de page
le tout centré au milieu
et j'aimerais que tout les blocs soit collés entre eux.
Sur firefox :
tout est collé sauf le pied ou il y a un décalage
Sur Internet Explorer :
tout est collé meme le pied sauf qu'il y a un espace vertical entre les
deux blocs

voici le html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
		<title>PUB</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<link rel="stylesheet" media="screen" type="text/css" title="" href="pik.css" />
	</head>
	<body>

		<div id="en_tete">
			
		</div>
		<ul id="nav">
			<li class="texte"><a href="">Accueil</a></li>
			<li class="texte"><a href="">equipage</a></li>
			<li class="texte"><a href="">Soirées</a></li>
			<li class="texte"><a href="">Plan</a></li>
			<li class="texte"><a href="">Livre d'or</a></li>
		</ul>		
		
		<div id="menu">
			<div class="petit_menu">
				<h3>Liens utiles</h3>

				
				<h3>Contact</h3>

				
			</div>
		</div>      
	

		<div id="corps">
			<h1>bienvenue au Noroît</h1>
		
			<h2>Ouvert tout les jours de 18 h à 1 h.</h2>
			<p>
				Hôtellerie, restauration, tourisme ou nautisme, tous les secteurs emploient <br/>
				des saisonniers et, partout, les abus sont les mêmes : défaut de contrat de <br/>
				travail, heures supplémentaires non rémunérées, pourboire dans la poche de <br/>
				l’employeur ou heures effectuées "oubliées"..<br />
				
			</p>
			

		</div>
		
		
		<div id="pied">
			<p>
				Reproduction interdite sans autorisation.<br />
				code et design Eric F.<br />
				Derniere mise a jour le 26/07/2005.
			</p>

		</div>
	</body>
</html>

et le css:
body {
width : 80%;
margin : auto;
margin-top : 20px;
margin-bottom : 0px;
background-color : black;
}

#en_tete {
height : 200px;
background-color : blue;
}

#nav
{
height : 30px;
margin : 0px;
padding : 0;
background-color : green;
list-style-type : none;
}

#nav li {
padding : 0 0.5em;
line-height : 30px;
}

#nav li.texte
{
float : left;
border-right : 1px solid black;
}



#nav a {
color : black;
text-decoration : none;
padding : 0 0.5em;
font : 0.8em "Comic Sans MS";
}

#nav a:hover {
color : red;
font-style : ;
}


#menu {
float : left;
width : 22%;
height:500px;
padding : 5px;
margin-top : 0px;
margin-bottom : 0px;
background-color : white;
}

#corps {
margin-top : 0px;
margin-left : 21%;
height:500px;
margin-bottom : 0px;
padding : 5px;
color : black;
background-color : yellow;
}

#corps h1 {
color : black;
text-align : center;
font-family : "Comic Sans MS";
}

#corps h2 {
padding-left : 30px;
color : black;
text-align : left;
}

p
{
padding-left : 30px;
color : black;
text-align : left;
}

#pied
{
padding : 0px;
margin-top:0px;
height:100px;
text-align : center;
color : black;
background-color : red;
}

voila j'espère avoir été suffisamment clair
merci d'avance
Sujet clos
Aller à