Bonsoir,
Je me permet de demander un peu d'aide concernant un décalage que j'ai entre Internet Explorer 6 et Firefox 1.5.
Le menu s'affiche correctement dans IE mais est décalée de plusieurs pixels sur la droite sur FF comme dans l'image jointe.
Le code XHTML :
Le code CSS :
Merci d'avance pour votre aide.
Modifié par Zguen (01 Nov 2007 - 12:47)
Je me permet de demander un peu d'aide concernant un décalage que j'ai entre Internet Explorer 6 et Firefox 1.5.
Le menu s'affiche correctement dans IE mais est décalée de plusieurs pixels sur la droite sur FF comme dans l'image jointe.
Le code XHTML :
<!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>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<title>Test</title>
<link rel="stylesheet" type="text/css" href="css/screen.css" media="screen,projection" />
</head>
<body>
<div id="page">
<div id="gauche">
<div id="logo">
<a href="#"><img src="img/logo.gif" title="" /></a>
</div><!-- FIN #logo-->
<div id="menu">
<ul>
<li><a href="#" title="" accesskey="">Présentation <span>Présentation de la société</span></a></li>
<li><a href="#" title="" accesskey="">Services <span>Tous nos services</span></a></li>
<li><a href="#" title="" accesskey="">Références <span>Nos dernières références</span></a></li>
<li><a href="#" title="" accesskey="">Contact <span>Téléphone, fax, email</span></a></li>
</ul>
</div><!-- FIN #menu-->
</div><!-- FIN #gauche-->
<div id="droite">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis facilisis blandit lorem. Nunc nisl ante, feugiat et, laoreet vel, adipiscing at, tellus. Vivamus dapibus turpis quis orci. Curabitur turpis. Mauris at ligula. Nullam ornare magna eu ante. Nam posuere porta magna. Mauris sed ligula vitae turpis egestas suscipit. Quisque nonummy facilisis leo. Nunc risus. Mauris blandit lacus a nisl.</p>
<p>Suspendisse non urna at arcu scelerisque lacinia. Nulla vel justo. Nulla pulvinar. Donec est massa, aliquam porttitor, egestas eu, tincidunt vel, erat. Vestibulum vel lectus at lorem cursus congue. Integer ipsum tellus, condimentum at, volutpat et, sollicitudin vel, nulla. Aliquam erat volutpat. Donec ut leo nec purus varius faucibus. In vehicula leo in metus. Suspendisse a libero. Mauris faucibus placerat nulla. Nunc pretium justo et tellus. Suspendisse potenti. Sed sapien. Sed vitae enim et enim placerat sodales. In hac habitasse platea dictumst.</p>
<div id="bas">
<p>tel./fax : 12 34 56 78<br /></p>
</div>
</div><!-- FIN #droite-->
</div><!-- FIN #page-->
</body>
</html>Le code CSS :
*{
padding:0px;
margin: 0px;
}
body{
background: #c7cdd1 url(../img/bg.png) left top repeat;
text-align:center;
margin:25px 0;padding:0;
}
#page{
width:780px;
margin:0 auto;
background:grey;
}
#gauche{
float:left;
width:230px;
background:#FFF;margin:0px;padding:0px;
text-align:left;
}
#gauche img{
border:none;
}
#logo{margin:0;padding:0;}
#droite{
width:530px;
margin-left:235px;
background:#515B64;
padding:15px;
text-align:justify;
}
#gauche #menu ul {
list-style: none outside;
font-family: Tahoma, "Lucida Grande CE", lucida, sans-serif;
width:240px;
margin:0px;
padding:0px;
}
#gauche #menu ul li {
font-size: 120%;
font-weight: bold;margin-bottom: 1px;
}
#gauche #menu ul li a {
display: block;
height: 70px;
padding: 10px 10px 0px 10px;
width: 240px;
text-decoration: none;
color: #636f7a;
}
#gauche #menu ul li a {
background: #d8d8d8 url(../img/menu.jpg) left bottom no-repeat;
}
#gauche #menu ul li a:hover {
background: #bababc url(../img/menu.jpg) left top no-repeat;
}
#gauche #menu ul li a span {
display: block;
font-size: 60%;
font-weight: normal;
color: black;
}Merci d'avance pour votre aide.
Modifié par Zguen (01 Nov 2007 - 12:47)
