probleme d'affichage sur IE
Bonjour a tous!
J'ai un probleme d'affichage du header de ma page sur Internet explorer (alors que cela fonctionne bien sur Firefox)
En fait l'image du centre est décalé plus bas alors qu'elle devrait être alignée.
Voila le code de ma page si quelqu'un a une petite idée.
Merci d'avance
<!doctype html public "-//w3c//dtd html 4.01 transitional//en">
<html>
<head>
<title>test</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link href="css/styles2.css" rel="stylesheet" type="text/css">
</head>
<body>
<center>
<div id="conteneur" >
<!-- header -->
<ul id="menugauche">
<li>
<img src="images/haut.gif" width=165 height=17 border=0 alt="bb">
</li>
<li>
<a href="testdiv.html"><img name="home_page" src="images/home-page.gif" width=165 height=28 border=0 alt="home page"></a>
</li>
<li>
<a href="historique.html"><img name="historique" src="images/historique.gif" width=165 height=24 border=0 alt="Historique"></a>
</li>
<li>
<a href="#"><img name="services" src="images/services.gif" width=165 height=24 border=0 alt="services"></a>
</li>
<li>
<a href="#"><img name="products" src="images/products.gif" width=165 height=24 border=0 alt="products"></a>
</li>
<li>
<a href="#"><img name="support" src="images/support.gif" width=165 height=24 border=0 alt="support"></a>
</li>
<li>
<a href="#"><img name="news" src="images/news.gif" width=165 height=24 border=0 alt="news"></a>
</li>
<li>
<a href="#"><img name="contacts" src="images/contacts.gif" width=165 height=24 border=0 alt="contacts"></a>
</li>
<li>
<img name="m3" src="images/m3.gif" width=165 height=83 border=0 alt="">
</li>
</ul>
<div id="droite">
<img src="images/main2.gif" width=246 height=272 alt="">
</div>
<ul id="centre">
<li>
<img src="images/main1.gif" width=336 height=204 alt="">
</li>
<li id="textehaut">
<span class="text7">blablablabal</span>
</li>
</ul>
<!-- fin header -->
<!-- le coprs -->
<div id="corps">
<p>blablablabla</p>
</div>
<!-- fin du corps -->
<!-- footer -->
<ul id="pied">
<li class="text6">
copyright 2006 ©
</li>
<li class="text6">
<a href="#">accueil</a> | <a href="#">plan du site</a> | <a href="#">mentions légales</a> | <a href="#">contact</a> | <a href="#">news</a>
</li>
</ul>
<!-- fin footer -->
</div>
</center>
</body>
</html>
et voici ma css
body {
font-family: Verdana;
font-size: 10px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #525252;
padding: 0;
margin:0 ;
}
#conteneur {
width: 747px;
border: 1px solid black ;
}
#centre {
margin-left: 165px;
margin-right: 246px;
margin-top: 0px;
margin-bottom:10px;
padding: 0px;
border: 0px;
}
#centre li {
list-style-type: none;
}
#corps {
}
#textehaut {
width: 336px;
height: 68px;
font-family: tahoma;
font-size: 10px;
font-weight: normal;
color: #FFFFFF;
background-image:url("../images/main3.gif");
}
#basheader {
margin-left: 165px;
padding: 0px;
border-width: 0px;
}
#gauche {
width:146px;
}
#droite {
float:right;
margin: 0px;
padding: 0px;
border-width: 0px;
display: inline;
}
#menugauche {
list-style-type: none;
margin-top: 5px;
margin-right: 0px;
margin-left: 0px;
margin-bottom: 0px;
float:left;
width: 165px;
border-width: 0px;
line-height: 0;
padding:0;
}
#menugauche li {
margin:0;
padding:0;
border:0;
display: inline;
}
#menugauche a {
color: #000000;
margin: 0px;
padding: 0px;
}
#menugauche a:hover {
text-decoration: none;
}
#menugauche img {
display: block;
}
#centre img {
display: block;
}
.text6 {
font-family: tahoma;
font-size: 10px;
color: #000000;
font-weight: bold;
}
