J'essaie de réaliser un menu vertical à l'aide d'une CSS.
Le but est de mettre un fond qui représente un boutton et qui change de couleur en rollover.
Voici ce que ca donne:
http://www.mobiletoken.com/com/testoli
Mon problème est qu'il se présente bien sous Firefox mais pas sur IE. Il n'est pas centré quelque soit la technique que j'utilise ( des left-margin, des left-padding, des div align=center...)
Voici le code que j'ai employé:
HTML
PHP
<div id="subnav" align="center">
<ul>
<li><a href="#">mt pac</a></li>
<li><a href="#">mt pac T&T </a></li>
<li><a href="#">mt vendito</a></li>
<li><a class="currentsub" href="#">mt celero</a></li>
</ul>
</div>
CSS
PHP
#subnav{
position:absolute;
background-color:#FFFFFF;
width:220px;
height:214px;
margin-top:30px;
margin-left:40px;
}
#subnav ul
{
list-style-type: none;
padding: 0;
margin: 0;
text-align: center;
}
#subnav li
{
margin-top:4px;
}
#subnav a {
display: block;
background-image:url(../images/subnav_normal.jpg);
background-repeat:no-repeat;
width: 9.4em;
height: 3em;
padding: .2em .8em;
text-decoration: none;
}
#subnav a:hover
{
background-image:url(../images/subnav_blue.jpg);
color: #FFF;
}
#subnav ul li a.currentsub, #nav ul li a.currentsub:visited {
background-image:url(../images/subnav_blue.jpg);
color: #FFF;
}
Y'aurait-il un moyen de régler ce problème ou une méthode plus adaptée pour réaliser ce genre de menu?
Merci!