Bonsoir à tous
Voila, ces derniers temps beaucoup de personnes ont délaissés les tableaux pour passer à la mise en page par feuille de style.
Je me suis, à mon tour, essayé à ce style qui semble offrir bien plus de possibilités.
Je travaille donc actuellement sur ma nouvelle mise en page depuis mercredi. J'ai du la refaire 5 ou 6 fois au total, car je me heurtais à des problémes différents à chaque fois.
Après avoir épluché plusieurs sites, et même effectué des recherches sur ce forum, j'ai pu corriger des bugs, mais alors que certains étaient éradiqués, d'autres apparaissaient, c'était interminable.
J'ai alors pris la décision d'utiliser une structure basique proposé sur un site tutorial, et d'adapter au fur et a mesure la structure à mes besoins.
J'ai donc commencé, ca se passe içi :
Lien du site
Alors j'explique mon probléme :
Quand on réduit la page suffisament, le carré orange (qui représente la zone de texte) va se placer sous le div du menu.
Je n'avais pas ce probléme dans mes premiers essais, et je me suis dis que, peut être, je devais passer ce calque là en position absolute.
Je m'éxecute donc, tout passe nickel sous Firefox et, surprise, le div concerné a disparu sur IE.
Sauriez vous quelle est la cause de cette disparition, ou mieux, la cause de ce décalage de div ?
Les sources sont très simples pour le moment :
Page :
Feuille de style :
Je vous remercie énormément d'avance
Modifié par Jouji (07 Apr 2007 - 22:53)
Voila, ces derniers temps beaucoup de personnes ont délaissés les tableaux pour passer à la mise en page par feuille de style.
Je me suis, à mon tour, essayé à ce style qui semble offrir bien plus de possibilités.
Je travaille donc actuellement sur ma nouvelle mise en page depuis mercredi. J'ai du la refaire 5 ou 6 fois au total, car je me heurtais à des problémes différents à chaque fois.
Après avoir épluché plusieurs sites, et même effectué des recherches sur ce forum, j'ai pu corriger des bugs, mais alors que certains étaient éradiqués, d'autres apparaissaient, c'était interminable.
J'ai alors pris la décision d'utiliser une structure basique proposé sur un site tutorial, et d'adapter au fur et a mesure la structure à mes besoins.
J'ai donc commencé, ca se passe içi :
Lien du site
Alors j'explique mon probléme :
Quand on réduit la page suffisament, le carré orange (qui représente la zone de texte) va se placer sous le div du menu.
Je n'avais pas ce probléme dans mes premiers essais, et je me suis dis que, peut être, je devais passer ce calque là en position absolute.
Je m'éxecute donc, tout passe nickel sous Firefox et, surprise, le div concerné a disparu sur IE.
Sauriez vous quelle est la cause de cette disparition, ou mieux, la cause de ce décalage de div ?
Les sources sont très simples pour le moment :
Page :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" >
<title>Document sans nom</title>
<link href="/includes/css/css3.css" rel="stylesheet" type="text/css" >
</head>
<body>
<div id="bandeau">Ceci est le bandeau</div>
<div id="menu"><div class="element-menu">Ceci est le menu</div></div>
<div id="contenu">Ceci est le contenu</div>
<div id="piedpage">Ceci est le pied de page</div>
</body>
</html>
Feuille de style :
body, html{
height:100%;
margin:0;
padding:0;
}
body {
background-color:#000000;
background-image:url(../../images/commun/backback.jpg);
background-repeat:repeat-y;
}
div#bandeau {
width:862px;
height:400px;
background-image:url(../../images/commun/ban.jpg);
background-repeat:no-repeat;
}
div#contenu {
width:600px;
height:400px;
background-color:#FFCC00;
margin-left: 176px;
}
div#piedpage {
width:600px;
height:50px;
background-color:#33FF99;
clear:both;
}
div#menu {
float:left;
width:176px;
height:400px;
}
.element-menu {
margin-left: 36px;
}
Je vous remercie énormément d'avance
Modifié par Jouji (07 Apr 2007 - 22:53)