Centrar Menu Desplegable CSS Hola a tod@s!
Tengo un problema y es que he he hecho un menú desplegable en css pero no consigo centrarlo en la página. No sé que atributo poner ni a que contenedor ponerselo. Espero puedan ayudarme. No me deja poner urls por no haber escrito todavía 30 mensajes así que pegaré aquí el código..
CÓDIGO LISTA DESPLEGABLE
----------------------------
<div id="menu"> <!-- Lo coge todo -->
<ul id="nav"> <!--ul principal -->
<li id="cv" class="off"><a href="#">CV</a>
<ul >
<li><a href="cv_spanish.html">ESPAÑOL</a></li>
<li><a href="cv_english.html">ENGLISH</a></li>
</ul></li>
<li id="investigacion" class="off"><a href="#">INVESTIGACIÓN</a>
<ul>
<li><a href="#">TESINA</a></li>
<li><a href="#">DEA</a></li>
<li><a href="#">MENSAJE ESPECIALIZADO</a></li>
</ul></li>
<li id="porfolio" class="on"><a href="#">PORFOLIO</a></li>
<li id="prensa" class="off"><a href="#">PRENSA</a>
<ul>
<li><a href="#">FOTOGRAFÍA</a></li>
<li><a href="#">REDACCIÓN</a></li>
<li><a href="#">BUSCAR PDF</a></li>
</ul></li>
<li id="enlaces" class="off"><a href="#">ENLACES</a>
<ul>
<li><a href="#">OTROS MEDIOS</a></li>
<li><a href="#">ORGANISMOS</a></li>
<li><a href="#">BLOGS</a></li>
</ul></li>
<li id="contacto" class="off"><a href="#">Contacto</a></li>
</ul>
</div>
CÓDIGO CSS
--------------
* {
margin: auto;
border: thin none Black;
padding: 0;
}
/* Donde está el bannaer */
#cabecera{
}
/* TODO */
#menu {
}
/* Todo el ul */
#nav {
background-color: transparent;
text-align: center;
float: left;
}
#cv{
margin: auto;
background-color: #231f20;
font: smaller serif;
text-decoration: none;
vertical-align: middle;
}
#investigacion{
background-color: #231f20;
font: smaller serif;
text-decoration: none;
vertical-align: middle;
width: 160px;
text-align: center;
}
#porfolio{
background-color: #231f20;
font: smaller serif;
text-decoration: none;
vertical-align: middle;
}
#prensa{
background-color: #231f20;
font: smaller serif;
text-decoration: none;
vertical-align: middle;
}
#enlaces{
background-color: #231f20;
font: smaller serif;
text-decoration: none;
vertical-align: middle;
}
#contacto{
background-color: #231f20;
font: smaller serif;
text-decoration: none;
vertical-align: middle;
}
ul {
padding: 0;
margin: 0;
list-style: none;
}
li {
float: left;
position: relative;
width: 9em;
}
li ul {
display: none;
position: center;
top: 1em;
left: 0;
}
li > ul {
top: auto;
left: auto;
}
li:hover ul, li.over ul{ display: block; }
A:link {
text-decoration: none;
color: White;
}
A:visited {
text-decoration: none;
color: White;
}
A:active {
text-decoration: none;
color: White;
}
A:hover {
text-decoration: none;
color: White;
}
