Re,
Autant pour moi, ce sont tes blocs qui sont mal calibrés par rapport à ton design, essaye avec ce code qui devrait être compatible FF, IE7&6 et opera.
En test, mets des borders à tous tes blocs dans ton code pour visualiser les problèmes, tu vas vite comprendre
<style type="text/css">
body{
background: #F5FFF7;
color: #78B683;
font-size: 80%;
line-height: 1.6em;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6{
font-family: "Trebuchet MS", sans-serif;
}
h1{font-size: 1.5em;}
h2{font-size: 1.4em;}
h3{font-size: 1.3em;}
h4{font-size: 1.2em;}
h5{font-size: 1.1em;}
h6{font-size: 1em;}
img{
border: none;
}
a{
color: #87785B;
text-decoration: none;
}
a:visited{
color: #216728;
}
a:hover{
color: #51955C;
text-decoration: underline;
}
/* Contenu */
#conteneur
{
width: 800px ;
height: auto;
margin: 0 auto ;
background-image:url('fond.jpg');
background-repeat:repeat-y;
border: 1px solid orange;
}
#contenu
{
text-align:left;
width: 550px;
padding : 0;
margin: 10px 0px 10px 200px;
border: 1px solid blue;
}
#menu
{
float: left;
display: inline; /* pour IE6 (double margin bug) ------------------------------------*/
text-align: left;
width: 140px;
font-size: 12px;
height: auto;
padding:0;
margin: 0 0 0 50px;
list-style-type:none;
border: 1px solid black;
}
#navigation
{
border: 1px solid yellow;
background-image:url('barre_navig.jpg');
background-repeat: no-repeat;
height: 56px;
}
#footer
{
background-image:url('footer.jpg');
background-repeat: no-repeat;
width: 800px;
height: 29px;
margin: 0 auto ;
clear: both;
}
</style>
</head>
<body>
<div id="conteneur">
<img src="header.jpg" alt="Kinox" />
<ul id="menu">
<li><a href="/">Accueil</a></li>
<li><a href="/index.php?menu=Docs">Documentation</a></li>
<li><a href="/index.php?menu=Logos">Logos</a></li>
<li><a href="/index.php?menu=rejoindre">Nous rejoindre</a></li>
<li><a href="/index.php?menu=Contact">Nous contacter</a></li>
<li><a href="/index.php?menu=Legal">Informations légales</a></li>
</ul>
<div id="contenu">
<div id="navigation">test - truc</div>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus ut purus sed diam elementum feugiat. Nulla facilisi. Donec mattis laoreet neque. Curabitur a lectus. Vivamus quis diam vitae lorem congue varius. Nunc mi ipsum, ultricies at, adipiscing nec, mattis at, libero. Curabitur et neque. Integer nec diam. Proin volutpat lorem ac sem. Fusce felis. Maecenas eu ipsum. Sed a elit. Cras mi metus, blandit tincidunt, tempor at, pretium non, neque. Suspendisse et mi. Maecenas faucibus nibh a eros. Nam lorem turpis, posuere eu, gravida at, pretium vel, ante.
Mauris sed nisl. Donec nisl mi, mattis gravida, tincidunt condimentum, ultricies vel, massa. Aenean quam. Suspendisse condimentum. Sed est. Integer sagittis malesuada justo. Maecenas adipiscing, sapien eget facilisis faucibus, felis odio ornare risus, nonummy molestie tellus mi quis tellus. Morbi ligula risus, vehicula eget, tincidunt semper, semper nec, ante. Pellentesque faucibus neque et mi aliquam porta. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed orci dolor, placerat nec, interdum eu, faucibus consectetuer, nisl. Vivamus quis mi. Aenean mi. Phasellus augue velit, convallis quis, semper ut, bibendum eget, tellus. Aenean ac ipsum nec nulla faucibus accumsan.
Vestibulum eu justo. Morbi ac velit quis augue tristique adipiscing. Mauris sed elit et justo rutrum feugiat. Duis tempus purus id enim. Fusce justo. Aenean mattis libero non odio. Phasellus quam lectus, dignissim at, elementum non, feugiat sed, dolor. Fusce nec purus. Praesent in massa vel sem elementum vulputate. Praesent est odio, pellentesque quis, scelerisque at, elementum nec, purus. Aliquam erat volutpat.
</div>
<div id="footer"></div>
</div>
</body>
