Merci d'avoir pris le temps de répondre....
Je vous joind une partie de mon code que je ne cesse de modifier avec les absolute...
----tout d'abord mon indexation----
<link type="text/css" rel="stylesheet" href="style.css">
<html>
<body>
<div id="conteneur">
<div id="header-banniere"></br>
</div>
<div id="menu-haut"> <ul class="menuhaut"> <?php include("accueil/menu-inc.php")?> </ul>
</div>
<div id="conteneur1">
<div id="menu-gauche"><? include("accueil/menu_gauche-inc.php"); ?>
</div>
<div id="centre"></br><center><?php include("accueil/news-inc.php")?></center>
</div>
</div>
<div id="pied"><center><b> © Copyright : 33Devil66 </b></center>
</div>
</div>
</body>
</html>
Ensuite ce qui me concerne ici le menu-haut:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
<!--
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>
<body>
<div style="padding:1px;padding-bottom:2px;">
<div style="padding-left:1px;" class="bordure">
<div style="width:100%;text-align:center;font-size:16px;" class="fond_menu">
<dl>
<dt onmouseover="javascript:montre();"><a href="" title="Retour à l'accueil">Accueil</a></dt>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu1');">Menu 1</dt>
<dd id="smenu1">
<ul>
<li><a href="#">Sous-Menu 1.1</a></li>
<li><a href="#">Sous-Menu 1.2</a></li>
<li><a href="#">Sous-Menu 1.3</a></li>
<li><a href="#">Sous-Menu 1.4</a></li>
<li><a href="#">Sous-Menu 1.5</a></li>
<li><a href="#">Sous-Menu 1.6</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre();"><a href="">Menu 2</a></dt>
</dl>
</div>
</div>
</div>
</body>
</html>
Et enfin mon style Css:
body {font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 20;
padding: 0;
background-color:#124ddb;
margin: 0;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
/* pour la baniere*/
#header-banniere {height: 150px;
background-color: #99CCCC;
background-image: url("banniere.jpg");
}
/* le menu haut*/
#menu-haut {height: 30px;
background-color:#3366FF;
}
#menu-haut {
top: 150px;
z-index:100;
width: 100%; /* correction pour Opera */
}
#menu-haut dl {
float: left;
width: 12em;
}
#menu-haut dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 1px solid gray;
margin: 1px;
}
#menu-haut dd {
display: none;
border: 1px solid gray;
}
#menu-haut li {
text-align: center;
background: #fff;
}
#menu-haut li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu-haut li a:hover, #menu-haut li a:focus, #menu-haut dt a:hover, #menu-haut dt a:focus {
background: #eee;
}
/* gere tous le site :date banniere pied centre etc... */
#conteneur {z-index:70;
position: absolute;
width: 1024px;
height :768px;
left: 50%;
margin-left: -510px;
}
/* contient juste le menu gauche et le centre */
#conteneur1
{
background-color:#33CCFF;
height:588px;
}
html>body #conteneur1
{
height:auto;
min-height:588px;
}
#centre {min-height:588px;
background-color:#33CCFF;
position: absolute;
z-index:20;
margin-left: 150px;
}
#menu-gauche
{
width: 150px;
height: 100%;
background-color:#CC66FF;
position: absolute;
z-index:1;
left:0;
}
html>body #menu-gauche
{
height:auto;
min-height:588px;
}
#pied {height: 20px;
position: absolute;
width: 100%;
z-index:10;
background-color: #3366FF;
}
voilà je sais que ça fait beaucoup de coden j'en suis désolé bon courage tout de meme....
merci
