Bonsoir
J'ai commencé la mise en page de mon site internet et je me heurte à l'éternel problème de compatibilité avec IE, aprés plusieurs essais je n'arrive toujours pas à résoudre le probléme, c'est une problème de positionement des blocks, la solution qui me vien à l'idée est de faire deux feuilles de style, une normale pour les navigateurs comme Firefox et Opera et une feuille "bidouillée" pour IE6.
Ma question est la suivante: Est ce que cette méthode est vraiment utile dans ce cas la ?
Une autre question qui me vien: Sous quels navigateurs dois-je tester mon site pour être sur de ne pas avoir de surprises ?
Au cas ou je vous donne mon code si la solution est simple.
code html:
Et mon code css ( il y a des avertissements au validateur mais je ne croit pas qu'ils soit à prendre en compte pour mon problème et je vait aller les résoudre de ce pas)
Pour la mise en page j'ai suivit l'exemple des modèles ( le numéro 9 ) disponibles sur le site et j'aimerais aussi savoir la difference entre le 9, le 15 et le 16.
Merci à vous et bonne soirée.
J'ai commencé la mise en page de mon site internet et je me heurte à l'éternel problème de compatibilité avec IE, aprés plusieurs essais je n'arrive toujours pas à résoudre le probléme, c'est une problème de positionement des blocks, la solution qui me vien à l'idée est de faire deux feuilles de style, une normale pour les navigateurs comme Firefox et Opera et une feuille "bidouillée" pour IE6.
Ma question est la suivante: Est ce que cette méthode est vraiment utile dans ce cas la ?
Une autre question qui me vien: Sous quels navigateurs dois-je tester mon site pour être sur de ne pas avoir de surprises ?
Au cas ou je vous donne mon code si la solution est simple.
code html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title></title>
<meta http-equiv="Content-Type" content="text-html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css" title="Design sombre" href="style/style.css" />
</head>
<body>
<div id="contener">
<div id="header"><div id="banniere"></div><div id="menu_horisontal"></div></div>
<div id="menu_gauche"></div><div id="menu_droite"></div>
<div id="edito"></div><div id="corps"></div>
<div id="banniere_pub"></div>
<div id="footer"></div>
</div>
</body>
</html>
Et mon code css ( il y a des avertissements au validateur mais je ne croit pas qu'ils soit à prendre en compte pour mon problème et je vait aller les résoudre de ce pas)
*
{
margin:0;
padding:0;
}
#contener
{
width: 940px;
height:800px;
margin:auto;
background-color:#FDC689;
}
#header
{
width:940px;
height:220px;
}
#banniere
{
width:940px;
height:200px;
background-color:#005B7F;
}
#menu_horisontal
{
width:940px;
height:20px;
background-color:#FFF200;
}
#edito
{
width:500px;
height:200px;
margin-top:10px;
margin-left:auto;
margin-right:auto;
background-color:#b00089;
}
#corps
{
width:500px;
height:360px;
margin-top:10px;
margin-left:auto;
margin-right:auto;
background-color:#b00089;
}
#menu_gauche
{
width:200px;
height:400px;
margin-top:10px;
margin-left:10px;
margin-right:10px;
background-color:#b00089;
float:left;
}
#menu_droite
{
width:200px;
height:400px;
margin-top:10px;
margin-left:10px;
margin-right:10px;
background-color:#b00089;
float:right;
}
Pour la mise en page j'ai suivit l'exemple des modèles ( le numéro 9 ) disponibles sur le site et j'aimerais aussi savoir la difference entre le 9, le 15 et le 16.
Merci à vous et bonne soirée.
) du coup entre ie et ff il y a une difference a gauche de 10px(marge doubleé a gauche) +3px (espace minimale entre un flottant et un element dans le flux) et idem a droite + 10px + 3px en tout 26px ! 