Hola amigos,
No paro de revisar el código y no se donde está el error.
Tengo un menú superior, y quiero centrarlo, pero por más que modifique no lo centra siempre esta alineado a la izquierda.
Alguien me puede echar un cable?
Este es el codigo HTML del menú:
Código:
body {
background-color: #FFF;
}
</style>
</head>
<body style="color: #FFF">
<div id="wrapper-top">
<div id="container-top">
<div id="top">
<a href="index.html"><img src="images/logo.png" alt="" /></a>
</div><!-- end #top -->
<div id="navtop">
<ul id="topnav">
<li id="home"><a class="current" href="index.html">inicio</a></li>
<li><a href="about.html">squisit</a>
<ul>
<li><a href="#">This is Only</a></li>
<li><a href="#">For Example</a></li>
<li><a href="#">Dropdown Menu</a></li>
</ul>
</li>
<li><a href="services.html">Services</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="faq.html">Faq</a></li>
<li><a href="contact.html">Contacto</a></li>
</ul><!-- end #topnav -->
</div><!-- end #navtop -->
... y este el código CSS:
Código:
#wrapper-top{
/* [disabled]background-image:url(../images/bg-wrapper.gif); */
/* [disabled]background-repeat:repeat-x; */
background-color:#fafafa;
margin: 0 auto 0 auto;
width: 996px;
text-align: left;
}
#wrapper-bottom{background-color:#e9e9e9; min-height:390px;}
#container-top{
margin:0 auto;
width:996px;
background-color: #FFF;
}
#container-bottom{margin:0 auto; width:990px;}
/* TOP */
#top{
height:100px;
text-align: center;
}W
#logo h1, #logo h1 a, #logo h1 a:visited{font-size:40px; color:#3d73a2; margin-bottom:0px; padding:20px 0px 0px 40px; text-decoration:none; font-weight:normal; }
#logo h1 a:hover{text-decoration:none;}
#logo .desc{color:#7c7a6b; font-size:14px; padding-left:25px;}
#logo{width:320px; float:left;}
#navtop{
/* [disabled]background-image:url(../images/bg-navtop.png); */
background-repeat:no-repeat;
background-position:top;
height:60px;
position:relative;
z-index:100;
text-align: center;
margin: auto;
}
#topnav, #topnav ul{
margin:0;
padding:0;
list-style-type:none;
position:relative;
line-height:1.5em;
}
#topnav{
padding:10px 13px 0px 13px;
width: 732px;
}
#topnav a{
display:block;
padding:0px 0px;
color:#323945;
text-decoration:none;
text-transform:uppercase;
width:120px;
}
#topnav a.current{color:#3e4653; background-image:url(../images/bg-navlink.png); background-repeat:no-repeat; }
#topnav a:hover{
background-image:url(../images/bg-navlink.gif); background-repeat:no-repeat;
}
#topnav li a:hover {
background-image:url(../images/bg-navlink.gif); background-repeat:no-repeat;
}
#topnav li:hover a,
#topnav li.sfHover a {
background-image:url(../images/bg-navlink.png);
background-repeat:no-repeat;
}
#topnav li:hover ul a:hover,
#topnav li.sfHover ul a:hover {
background-image:url(../images/bg-navlink.gif); background-repeat:no-repeat;
}
#topnav li{
float:left;
position:relative;
padding-left:0px;
padding-right:0px;
line-height:38px;
padding-bottom:4px;
padding-top:2px;
font-size:12px;
text-align:center;
margin-right:2px;
}
#topnav li#home{background-image:none;}
#topnav li li{
padding-right:0px;
text-transform:capitalize;
line-height:25px;
padding:0px 0px;
background-image:none;
}
#topnav ul {
position:absolute;
display:none;
width:190px;
top:3.3em;
left:0px;
background-color:#fff;
padding-bottom:25px;
border:solid 1px #d6fbd5;
border-width:0px 1px 1px 1px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-bottomleft:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
}
#topnav li ul a{
width:144px;
height:auto;
margin:0 13px;
padding:3px 10px 0px 10px;
text-transform:capitalize;
border-bottom:solid 1px #f4f5f5;
text-align:left;
color:#a1a1a1
}
#topnav li ul a, #topnav li ul a:hover{background-image:none !important; }
#topnav li ul a:hover{}
#topnav ul ul{
top:0px;
}
#topnav li ul ul {
left:12em;
margin:0px 0 0 0px;
}
#topnav li:hover ul ul, #topnav li:hover ul ul ul, #topnav li:hover ul ul ul ul{
display:none;
}
#topnav li:hover ul, #topnav li li:hover ul, #topnav li li li:hover ul, #topnav li li li li:hover ul{
display:block;
}
Gracias de antemano!