J'ai un petit problème d'affiche avec mon site ... (Voir fichiers joints, suivre les deux flêches) ...
Comme vous le voyez, sur Fire Fox, ca marche parfaitement et sur IE, il y a un petit problème d'affichage avec mes deux tableaux, ils sont décalés ...
Voici la source HTML :
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>XXXXX</title>
</head>
<body>
<table cellpadding="0" cellspacing="0" class="conteneur">
<tr>
<td class="header">
<a href="XXXXX" title="Marilyn Manson"><img border="0px" src="/img/head_gauche.gif" width="460" height="80" alt="XXXXX" /></a>
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" class="conteneur">
<tr>
<td valign="top" class="menu">
<div id="texte-menu">
LE MENU
</div>
</td>
<td valign="top" class="contenu"><p />
<div align="center">
<table cellpadding="0" cellspacing="0" class="contenu2">
<tr>
<td>
<div id="texte-contenu2">
<h1>XXXXX</h1> <h3>XXXXX ...</h3><p />
LA PAGE
</div>
</td>
</tr>
</table>
</div><br />
BAS
</td>
</tr>
</tablebox>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>XXXXX</title>
</head>
<body>
<table cellpadding="0" cellspacing="0" class="conteneur">
<tr>
<td class="header">
<a href="XXXXX" title="Marilyn Manson"><img border="0px" src="/img/head_gauche.gif" width="460" height="80" alt="XXXXX" /></a>
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" class="conteneur">
<tr>
<td valign="top" class="menu">
<div id="texte-menu">
LE MENU
</div>
</td>
<td valign="top" class="contenu"><p />
<div align="center">
<table cellpadding="0" cellspacing="0" class="contenu2">
<tr>
<td>
<div id="texte-contenu2">
<h1>XXXXX</h1> <h3>XXXXX ...</h3><p />
LA PAGE
</div>
</td>
</tr>
</table>
</div><br />
BAS
</td>
</tr>
</tablebox>
</body>
</html>
Et la source CSS :
CODE
body {
color: #000000;
font-size: 11px;
font-family: georgia;
margin: 0;
padding: 0;
margin-top: 0px;
margin-bottom: 0px;
margin-right: 0px;
text-align: left;
}
a
{
color: #C00000;
text-decoration: none;
font-size: 11px;
}
a:hover
{
color: #000000;
text-decoration: underline;
}
.conteneur
{
border: none;
margin-bottom: 0px;
width: 100%;
background-color: #FFFFFF;
}
.header
{
border: none;
padding: 0px;
margin: 0px;
width: 100%;
height: 80px;
background-image: url(/img/head_bg.gif);
background-repeat: repeat-x;
}
.menu
{
padding: 0px;
margin: 0px;
text-align: left;
border-top: 0px solid;
border-right: 1px solid #D9D9D9;
border-bottom: 1px solid #D9D9D9;
background-color: #F4F4F4;
}
div#texte-menu
{
color: #727272;
font-family: georgia;
font-size: 11px;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
}
div#texte-menu a
{
color: #727272;
text-decoration: none;
font-style: italic;
font-size: 11px;
}
div#texte-menu a:hover
{
color: #000000;
text-decoration: none;
}
div#texte-menu h3
{
margin-left: 15px;
margin-top: 0px;
margin-bottom: 2px;
font-size: 12px;
color: #8A8787;
}
.contenu
{
padding: 0px;
margin: 0px;
width: 100%;
text-align: center;
margin-top: 0px;
}
.contenu2
{
width: 90%;
text-align: left;
margin-top: 0px;
margin-left: 0px;
}
div#texte-contenu2
{
margin-top: 10px;
margin-left: 5px;
color: #5C5C5C;
font-family: georgia;
font-size: 11px;
}
div#texte-contenu2 a
{
color: #C00000;
text-decoration: none;
font-size: 11px;
}
div#texte-contenu2 a:hover
{
color: #000000;
text-decoration: underline;
font-size: 11px;
}
div#texte-contenu2 h1
{
margin-left: 15px;
margin-top: 0px;
margin-bottom: 2px;
font-size: 18px;
color: #999999;
font-family: georgia;
}
div#texte-contenu2 h2
{
margin-left: 15px;
margin-top: 0px;
margin-bottom: 10px;
border-top: 1px solid;
border-color: #959595;
font-size: 12px;
color: #000000;
font-family: georgia;
}
div#texte-contenu2 h3
{
margin-left: 25px;
margin-top: 0px;
margin-bottom: 2px;
font-size: 11px;
color: #B7B6B6;
font-family: georgia;
font-style: italic;
}
div#texte-contenu2 p
{
line-height: 15px;
}
.contenu3
{
width: 100%;
text-align: left;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
background-color: #FFFFFF;
border-bottom: 2px solid;
border-color: #D9D9D9;
}
pre
{
color: #5C5C5C;
font-size: 11px;
font-family: georgia;
}
.bouton {
color: #5C5C5C;
font-family: georgia;
font-size: 11px;
border: 1px solid #D9D9D9;
background-color: #F9F9F9;
}
color: #000000;
font-size: 11px;
font-family: georgia;
margin: 0;
padding: 0;
margin-top: 0px;
margin-bottom: 0px;
margin-right: 0px;
text-align: left;
}
a
{
color: #C00000;
text-decoration: none;
font-size: 11px;
}
a:hover
{
color: #000000;
text-decoration: underline;
}
.conteneur
{
border: none;
margin-bottom: 0px;
width: 100%;
background-color: #FFFFFF;
}
.header
{
border: none;
padding: 0px;
margin: 0px;
width: 100%;
height: 80px;
background-image: url(/img/head_bg.gif);
background-repeat: repeat-x;
}
.menu
{
padding: 0px;
margin: 0px;
text-align: left;
border-top: 0px solid;
border-right: 1px solid #D9D9D9;
border-bottom: 1px solid #D9D9D9;
background-color: #F4F4F4;
}
div#texte-menu
{
color: #727272;
font-family: georgia;
font-size: 11px;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
}
div#texte-menu a
{
color: #727272;
text-decoration: none;
font-style: italic;
font-size: 11px;
}
div#texte-menu a:hover
{
color: #000000;
text-decoration: none;
}
div#texte-menu h3
{
margin-left: 15px;
margin-top: 0px;
margin-bottom: 2px;
font-size: 12px;
color: #8A8787;
}
.contenu
{
padding: 0px;
margin: 0px;
width: 100%;
text-align: center;
margin-top: 0px;
}
.contenu2
{
width: 90%;
text-align: left;
margin-top: 0px;
margin-left: 0px;
}
div#texte-contenu2
{
margin-top: 10px;
margin-left: 5px;
color: #5C5C5C;
font-family: georgia;
font-size: 11px;
}
div#texte-contenu2 a
{
color: #C00000;
text-decoration: none;
font-size: 11px;
}
div#texte-contenu2 a:hover
{
color: #000000;
text-decoration: underline;
font-size: 11px;
}
div#texte-contenu2 h1
{
margin-left: 15px;
margin-top: 0px;
margin-bottom: 2px;
font-size: 18px;
color: #999999;
font-family: georgia;
}
div#texte-contenu2 h2
{
margin-left: 15px;
margin-top: 0px;
margin-bottom: 10px;
border-top: 1px solid;
border-color: #959595;
font-size: 12px;
color: #000000;
font-family: georgia;
}
div#texte-contenu2 h3
{
margin-left: 25px;
margin-top: 0px;
margin-bottom: 2px;
font-size: 11px;
color: #B7B6B6;
font-family: georgia;
font-style: italic;
}
div#texte-contenu2 p
{
line-height: 15px;
}
.contenu3
{
width: 100%;
text-align: left;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
background-color: #FFFFFF;
border-bottom: 2px solid;
border-color: #D9D9D9;
}
pre
{
color: #5C5C5C;
font-size: 11px;
font-family: georgia;
}
.bouton {
color: #5C5C5C;
font-family: georgia;
font-size: 11px;
border: 1px solid #D9D9D9;
background-color: #F9F9F9;
}
Merci d'avance pour votre aide ...
Maxime
