Ver Mensaje Individual
  #1 (permalink)  
Antiguo 06/04/2014, 02:37
daviesoterl
 
Fecha de Ingreso: abril-2014
Mensajes: 1
Antigüedad: 10 años, 1 mes
Puntos: 0
centrar menu horizontal

hola amigos tengo un problema espero puedan ayudarme mi menu horizontal esta alineado a la izquierda y lo quiero en el centro alguien podria ayudarme estoy en html5 y css

EL HTML


<!DOCTYPE html>
<html>
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="css/Style3.css" rel="stylesheet" />
<title>DIGITALIZACION</title>
</head>
<body>
<nav class="nav">
<div class="Container">
<ul class="ul">
<li><a href="">USUARIOS</a>
<ul>
<li><a href="">AGREGAR</a></li>
<li><a href="">CONSULTAR</a></li>
<li><a href="">MODIFICAR</a></li>
<li><a href="">ELIMINAR</a></li>
</ul>
</li>
<li><a href="">DOCUMENTOS</a>
<ul>
<li><a href="">AGREGAR</a></li>
<li><a href="">CONSULTAR</a></li>
<li><a href="">DESCARGAR</a></li>
</ul>
</li>
<li><a href="">AREAS</a>
<ul>
<li><a href="">AGREGAR</a></li>
<li><a href="">CONSULTAR</a></li>
<li><a href="">MODIFICAR</a></li>
<li><a href="">ELIMINAR</a></li>
</ul>
</li>
<li><a href="">SUB-AREAS</a>
<ul>
<li><a href="">AGREGAR</a></li>
<li><a href="">CONSULTAR</a></li>
<li><a href="">MODIFICAR</a></li>
<li><a href="">ELIMINAR</a></li>
</ul>
</li>
<li><a href="">TRAZABILIDAD</a>
<ul>
<li><a href="">AREAS</a>
<ul>
<li><a href="">AGREGAR</a></li>
<li><a href="">CONSULTAR</a></li>
<li><a href="">FEEDBACK</a></li>
</ul>
</li>
<li><a href="">SUB-AREAS</a>
<ul>
<li><a href="">AGREGAR</a></li>
<li><a href="">CONSULTAR</a></li>
<li><a href="">FEEDBACK</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</nav>
</body>
</html>


EL CSS:

* {
margin:0px;
padding:0px;
}

body {
background-color:orange;
text-align:center;
width:100%;
}


.nav {
float:left;
width:100%;
font-family:'Calisto MT';
font-weight:bold;
}

ul, ol {
list-style:none;
}

.nav li a {
background-color:green;
color:white;
text-decoration:none;
padding:10px 15px;
display:block;
border-radius:5px;
}

.nav li a:hover {
background-color:#96eaa2;
}

.ul > li {
float:left;
}

.nav li ul {
display:none;
position:absolute;
min-width:158px;
}

.nav li:hover > ul {
display:block;
}

.nav li ul li ul {
right:158px;
top:0px;
}

.Container {
text-align: center;
width: 100%;
}