Sur le forum alsa créations, j'utilise le menu horizontal : http://css.alsacreations.com/xmedia/exemples/deroulant/menu-horizontal.htm
Il est trés bien. De base, il est aligné à gauche. On donne des positions X Y en pixels pour le mettre ou on veut. Je souhaiterai utiliser la valeur Y pour le mettre à la hauteur, là pas de problème, mais je voudrais aussi le centrer au milieu de la page, sans forcement donner une position align en pixels.
Mon code css est :
<!--
/* CSS issu des tutoriels http://css.alsacreations.com */
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* position du menu complet */
top: 100px;
left: 110px;
z-index:100;
width: 100%;
background-position:center;
}
#menu dl {
float: left;
width: 12em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 0 px;
}
#menu dd {
border: 1px solid #296488; /* bordure du menu */
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block ;
height: 100%;
border: 0 none;
background: #DCE9F0;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}
#site {
position: absolute;
z-index: 1;
top : 130px;
left : 100px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray;
}
a {text-decoration: none;
color: black;
color: #222;
}
-->
Merci !!!
Il est trés bien. De base, il est aligné à gauche. On donne des positions X Y en pixels pour le mettre ou on veut. Je souhaiterai utiliser la valeur Y pour le mettre à la hauteur, là pas de problème, mais je voudrais aussi le centrer au milieu de la page, sans forcement donner une position align en pixels.
Mon code css est :
<!--
/* CSS issu des tutoriels http://css.alsacreations.com */
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* position du menu complet */
top: 100px;
left: 110px;
z-index:100;
width: 100%;
background-position:center;
}
#menu dl {
float: left;
width: 12em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 0 px;
}
#menu dd {
border: 1px solid #296488; /* bordure du menu */
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block ;
height: 100%;
border: 0 none;
background: #DCE9F0;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}
#site {
position: absolute;
z-index: 1;
top : 130px;
left : 100px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray;
}
a {text-decoration: none;
color: black;
color: #222;
}
-->
Merci !!!