Estoy teniendo un problema para crear un menú sencillo, estoy trabajando con una anchura de cuerpo de 1200px, quiero hacer que el menu sea horizontal con cuatro opciones y que las opciones ocupen cada una la misma cantidad de pixeles, siendo que el menu total ocupa 1200px en total. El problema es que no puedo poner los links de forma pareja en la capa y que no puedo centrarlos de forma vertical, les paso el codigo con el que estoy trabajando:
Código HTML :
<div id="menu"> <ul class="menu"> <li class="menu"><a class="temario" href="index.html#">Temario completo</a></li> <li class="menu"><a class="ejercicios" href="index.html#">Ejercicios resueltos</a></li> <li class="menu"><a class="ultimos" href="index.html#">Ultimos posts</a></li> <li class="menu"><a class="destacados" href="index.html#">Posts destacados</a></li> </ul> </div>
Código CSS :
#menu{
width:100%;
border-style:solid;
border-width:0 1px 1px 1px;
}
ul.menu{
width:1200px;
height:40px;
margin:0;
padding:0;
}
li.menu{
display:inline;
list-style-type:none;
border-style:solid;
border-width:1px;
}
a.temario{
background-color:#FFF702;
}
a.ejercicios{
background-color:#00E545;
}
a.ultimos{
background-color:#0013E5;
}
a.destacados{
background-color:#FF0000;
}
a.temario:link,a.ejercicios:link,a.ultimos:link,a.destacados:link{
font-family:calibri;
font-size:13pt;
text-decoration:none;
color:#fff;
font-weight:700;
padding:
}
a.temario:vicited,a.ejercicios:vicited,a.ejercicios:vicited,a.ultimos:vicited,a.destacados:vicited{
color:#fff;
}No puce en ningun lado como lo correria hacia el centro porque probe de todo y no funciono.
Muchas gracias por todo!
