28173 sujets

CSS et mise en forme, CSS3

Problème DIV sous IE et FF

Bonjour, je sais que ce problème est ultra-connu mais je galère depuis plusieurs jours, sans savoir le pourquoi du comment...
Pouvez-vous m'aider sur ce site.... En effet sous IE la barre bleue horizontale du bas est alignée tandis qu'avec Firefox la ligne est décalée.
Voici mon code INDEX.PHP :
<!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" lang="fr">
<head>
<title>Centrer une boite en CSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<LINK rel="stylesheet" type="text/css" href="style.css"></LINK>
</head>

<body>
<div id="global">
<div id="haut">
<img src='img/header/haut_0.jpg' width='255' height='81' border='0'></img><img src='img/header/haut_1.jpg' width='318' height='81' border='0'></img><img src='img/header/haut_2.jpg' width='227' height='81' border='0'></img>
</div>

<div class="milieu">
<div class="menu"><img src='img/fond.jpg' width='255' height='519' border='0'></img></div>
<div class="h_contents"><img src='img/haut_contents.jpg' width='545' height='53' border='0'></img></div>
<div class="d_contents"><img src='img/droite_contents.jpg' width='6' height='450' border='0'></img></div>
<div class="b_contents"><img src='img/bas_contents.jpg' width='505' height='6' border='0'></img></div>
</div>

</div>
</body>

</html>


Et mon fichier STYLE.CSS :
body {
	margin: 0;
	padding: 0;
}

img {
	margin:0;
	padding:0;
}

#global {
	position:absolute;
	left: 50%;
	top: 0%;
	width: 800px;
	height: 600px;
	margin-top: 0px; /* moitié de la hauteur */
	margin-left: -400px; /* moitié de la largeur */
	border: 1px solid #333;
	background-color: #FFFFFF;
}

#haut {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 800px;
	height: 81px;
}

.milieu {
	position : absolute;
	left: 0px;
	top: 0px;
	width: 800px;
	height: 519px;
}

.menu {
	position: absolute;
	left: 0px;
	top: 80px;
	width: 255px;
}

.h_contents {
	position: absolute;
	left: 243px;
	top: 88px;
}
.d_contents {	
        position: absolute;
	left: 755px;
	top: 125px;
}
.b_contents {
	position: absolute;
	left: 255px;
	top: 564px;
}



Pour voir ce que cela donne : http://doula78.free.fr/voile

Je vous remercie par avance de votre aide.
Doula.
Modifié par Doula (02 Jul 2006 - 13:32)
Sujet clos
Aller à