CSS:
#columnasupizq{
width: 170px;
height: 100%;
margin 0 auto;
float:left;
background-image: url("verde1.jpg");
border-style: outset; border-width: 2px;
margin-right:25px;
}
////////////
#menu{
margin-left: auto;
margin-right: auto;
width: 760px;
}
#menu {
text-align: center;
margin:0 auto;
}
#menu ul { list-style-type: none;
}
#menu ul li.nivel1 {
width: 155px;
}
#menu ul li.primera {
border-top: solid 1px #FFF;
}
#menu ul li a {
margin:0 auto;
display: block;
text-decoration: none;
color: #fff;
background-color: #399;
border: solid 1px #fff;
border-top: none;
padding: 8px;
}
#menu ul li:hover{
position: relative;
background-color: #6CC;
color: #000;
}
#menu ul li a:hover, #menu ul li:hover > a.nivel1{
background-color: #6CC;
color: #000;
}
#menu ul li a.nivel1{
display: block!important;
display: none;
}
#menu ul li ul{
display: none;
}
#menu ul li a:hover ul, #menu ul li:hover > ul {
display: block;
top:-1px!important;top: -31px;
}
CODIGO:
Menú
<li class="nivel1 primera"><a href="#" class="nivel1">Ver mi huella digital
</a> <li class="primera"><a href="#">Opción 1.1
</a></li> <li class="nivel1"><a href="#" class="nivel1">Enviarnos un archivo
</a> <li class="primera"><a href="#" class="nivel1">Opción 2.1
</a></li> <li><a href="#">Opción 2.2
</a></li> <li><a href="#">Opción 2.3
</a></li> <li><a href="#">Opción 2.4
</a></li> <li class="nivel1"><a href="#" class="nivel1">Descargar un archivo
</a> <li class="primera"><a href="#">Opción 3.1
</a></li> <li><a href="#">Opción 3.2
</a></li> <li class="nivel1"><a href="#" class="nivel1">Descargar programas
</a> <li class="primera"><a href="#">Opción 4.1
</a></li> <li><a href="#">Opción 4.2
</a></li> <li><a href="#">Opción 4.3
</a></li>
Llevo más de 2 días intentando centrarlo, y no tengo resultados, ayuda por favor.