bonjour
je me lance dans le positionnement css et je me rend compte que ce n'est pas gagné.
je veux faire une page qui remplace une disposition faite par la balise <frameset>
le tout en marche pas trop mal sauf sur IE.
L'idée c'est d'avoir une disposition qui occupe tout l'écran mais qui ai une taille minimum, de façon à pas avoir des chose qui disparaissent lorsque la personne réduit l'écran
je me suis basé sur l'exemple http://www.kachouri.com/tuto/tuto-98-dreamweaver-8--mise-en-forme-css-d-un-site-12.html[/url]
le problème avec IE c'est qu'il ne veut pas tenir compte de min-wight et qu'il place pas de scroll horizontal.
voici le code
je me lance dans le positionnement css et je me rend compte que ce n'est pas gagné.
je veux faire une page qui remplace une disposition faite par la balise <frameset>
le tout en marche pas trop mal sauf sur IE.
L'idée c'est d'avoir une disposition qui occupe tout l'écran mais qui ai une taille minimum, de façon à pas avoir des chose qui disparaissent lorsque la personne réduit l'écran
je me suis basé sur l'exemple http://www.kachouri.com/tuto/tuto-98-dreamweaver-8--mise-en-forme-css-d-un-site-12.html[/url]
le problème avec IE c'est qu'il ne veut pas tenir compte de min-wight et qu'il place pas de scroll horizontal.
voici le code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0.1 Transitional//EN">
<html>
<head>
<title>test de css</title>
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type">
<style type="text/css">
<!--
html,body{
background-color: #CCCCFF;
min-width: 900px;
min-height: 700px;
clip: rect(10px,10px,10px,10px);
height: 100%;
width: 100%;
overflow: auto;
}
#logo {
position:absolute;
top:10px;
width:100%;
height:75px;
z-index:1;
background-color: #9933FF;
}
#centre {
position:absolute;
top:85px;
z-index:2;
min-width: 700px;
min-height: 500px;
height: 100%;
width: 100%;
}
#navigation {
position:absolute;
left:0;
top:0px;
width:13%;
height:100%;
z-index:4;
background-color: #999999;
}
#contenu {
position:absolute;
left:13%;
z-index:5;
background-color: #993300;
top: 40px;
width: 87%;
height: 96%;
}
#menuOeuvre {
position:absolute;
left:13%;
top:0px;
width:87%;
height:40px;
z-index:4;
background-color: #CCFF00;
}
-->
</style>
<script type="text/javascript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
<body>
<div id="logo"></div>
<div id="centre">
<div id="menuOeuvre"></div>
<div id="navigation"></div>
<div id="contenu"></div>
</div>
</body>
</html>
