Estoy construllendo una pagina xhtml + css validandola a cada rato y va perfecta solo tengo un problemita con exploradores como firefox y opera especificamente con la barra de navegacion, en estos dos navegadores el padding left del menu se me duplica expreso el codigo xhtml y luego el css para que lo vean.
Este es el xhtml
Código :
<div id=\"menu\"> <ul> <li><a href=\"#\" class=\"selected\">Inicio</a></li> <li><a href=\"#\">Trabajos</a></li> <li><a href=\"#\">Curriculum</a></li> <li><a href=\"#\">Contacto</a></li> </ul> </div>
y este es el Css
Código :
#menu {
background-color: #669900;
margin: 0px;
float: left;
height: 25px;
width: 760px;
padding-left: 20px;
padding-top: 10px;
padding-bottom: 0px;
}
ul {
margin: 0px;
float: left;
list-style-type: none;
}
li {
float: left;
margin-right: 10px;
margin-left: 0px;
}
li a {
display:block;
color:#003300;
width:100px;
text-decoration:none;
font-weight:bold;
background-image: url(imagenes/menu1.png);
background-repeat: repeat-x;
background-position: top;
text-align: left;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 20px;
}
li a:hover {
color: #D3FFA8;
background-image: url(imagenes/menu2.png);
background-repeat: repeat-x;
background-position: top;
}
.selected {
color: #D3FFA8;
background-image: url(imagenes/menu2.png);
}
Espero haber sido claro, y si me pueden ayudar desde ya muchas gracias
