Bonjour,
Je me permet de faire un petit post qui fait le pendant d'un modèle de page de raphael en mode strict. On en parle pas assez du mode strict, mais il a quand meme l'avantage sous ie6 d'avoir un modèle de boite totallement compatible avec la norme (et c'est cool
.
Bref, le problème du mode strict IE, c'est que la plupart des solutions layout de site ne marchent pas. C'est pourquoi il faut faire une adaptation.
En voici une : Layout 2 colonnes (dont la gauche est fixe et ne bouge pas).
Testé sous IE6, firefox 1, netscape 7, mozilla 1.7.4 et opera 7.
Voila. a++
Je me permet de faire un petit post qui fait le pendant d'un modèle de page de raphael en mode strict. On en parle pas assez du mode strict, mais il a quand meme l'avantage sous ie6 d'avoir un modèle de boite totallement compatible avec la norme (et c'est cool
.Bref, le problème du mode strict IE, c'est que la plupart des solutions layout de site ne marchent pas. C'est pourquoi il faut faire une adaptation.
En voici une : Layout 2 colonnes (dont la gauche est fixe et ne bouge pas).
Testé sous IE6, firefox 1, netscape 7, mozilla 1.7.4 et opera 7.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<style type="text/css">
html, body {
margin:0;
padding:0;
font-family: Verdana, Arial, sans-serif;
font-size: 12px;
overflow-y:hidden; /* fix ie */
}
body {
width:100%;
height: 100%;
overflow: auto; /* ascenseur */ }
#contenu {
margin: 0 0 0 200px; /* refixe la marge */
}
#menu { /* menu fixe à gauche de l'écran */
left : 0;
width: 200px;
height: 100%;
position: fixed; /* non ie */
position: expression("absolute"); /* hack ie */
background-color:#ff2574;
}
.boite {width:400px ; height:800px ; border:2px solid black} /* boite servant à faire défiler l'écran, en débordant de la page */
</style>
</head>
<body>
<div id="menu"> <!- menu à gauche de l'écran -->
ZONE FIGEE A GAUCHE DE L'ECRAN
</div>
<div id="contenu"> <!- début du contenu de la page -->
<div class="boite">Contenu quelconque de la page</div>
</div> <!- fin du contenu de la page -->
</body>
</html>
Voila. a++
