Ver Mensaje Individual
  #1 (permalink)  
Antiguo 05/08/2009, 01:15
fgonzalezmx
 
Fecha de Ingreso: agosto-2009
Mensajes: 2
Antigüedad: 14 años, 8 meses
Puntos: 0
Ayuda para centrar menu horizontal en Firefox

Amigos, buenas noches

Tengo un problema muy similar al de este post dentro de forosdelweb: "como-centrar-este-menu-css-353257" (lo siento pero soy nuevo y no me dejan incluir enlaces ni direcciones web) estoy intentando centrar un menu horizontal en firefox y probe la solucion pero no me funciono a mi.

Es un menu horizontal de 6 opciones y cada una de esas opciones llama a un menu vertical situado mas abajo.

En IExplorer me funciona muy bien pero en Firefox no, me sale alineado a la izquierda e incluso me cambia el tamaño de cada boton a 181px cuando el real es de 160px. Pude corregir algunas cosas que se descuadraban en Firefox pero solo me hace falta que el menu horizontal quede centrado y con el tamaño de 160px como en el IExplorer. Adjunto css y html.

CSS

/*Menu Vertical Azul*/

#menuv_azul {
border: 1px solid #ACCFE8;
border-width: 1px 1px 0 1px;
width: 230px;
font: 10pt "Verdana", Arial, Helvetica, sans-serif;
}
#menuv_azul ul, li {
list-style-type: none;
}

#menuv_azul ul {
margin: 0;
padding: 0;
}

#menuv_azul li {
border-bottom: 1px solid #ACCFE8;
}

#menuv_azul a {
text-decoration: none;
color: #3366CC;
background: #F0F7FC;
display: block;
padding: 3px 6px;
width: 230px;
}

#menuv_azul a:hover {
color: #000000;
background: #DBEBF6;
}

/*Menu Vertical Verde de Titulo*/

#menuv_azul_title {
border: 1px solid #31CD21;
border-width: 1px 1px 0 1px;
width: 230px;
font: 10pt "Verdana", Arial, Helvetica, sans-serif;
}
#menuv_azul_title ul, li {
list-style-type: none;
}

#menuv_azul_title ul {
margin: 0;
padding: 0;
}

#menuv_azul_title li {
border-bottom: 1px solid #31CD21;
}

#menuv_azul_title a {
text-decoration: none;
color: #000000;
background: #31CD21;
display: block;
padding: 3px 6px;
width: 230px;
}

#menuv_azul_title a:hover {
color: #000000;
background: #31CD21;
}


/*Menu Horizontal General*/
#menuh {
font: 10pt "Verdana", Arial, Helvetica, sans-serif;
margin-top: 20px;
/*width: 960*/
width: 100%;
}

#menuh ul, li {
list-style-type: none;
}

/*
#menuh ul {
list-style-type: none;
margin: 0px;
padding: 0px;
width: 960px;
}
*/

#menuh ul {
margin: 0px;
padding: 0px;
}

#menuh li {
float: left;
/* width: 960px;*/
}

#menuh a {
text-decoration: none;
color: #ffffff;
background: #2F86C9;
display: block;
padding: 3px 10px;
text-align: center;
border: 1px solid #ACCFE8;
border-width: 1px 1px 1px 0px;
width: 160px;
}


#menuh a#primero {
border-left: 1px solid #ACCFE8;
}

#menuh a:hover {
color: #000000;
background: #ffffff;
}

PAGINA HTML

<table width="960" border="0" cellpadding="0" cellspacing="0" summary="botones_up">
<tr>

<div id="menuh">
<ul>
<li><a href="index.html" id="primero">Productos</a></li>
<li><a href="hosting.html">Hosting & Webdesign</a></li>
<li><a href="servicios.html">Servicios</a></li>
<li><a href="soporte.html">Soporte</a></li>
<li><a href="politicas.html">Pol&iacute;ticas</a></li>
<li><a href="nosotros.html">Nosotros</a></li>
</ul>
</div>

</tr>
</table>


</br>

<table width="960" border="0" cellpadding="0" cellspacing="0" summary="content">
<tr>
<td width="230" valign="top">
<div align="left" >
<table width="230" border="0" cellpadding="0" cellspacing="0" summary="botones_left" >
<div id="menuv_azul_title">
<ul>
<li><a href="#"><b><center>Soporte</center></b></a></li>
</ul>
</div>
<div id="menuv_azul">
<ul>
<li><a href="#menuv">Mantenimiento Preventivo</a></li>
<li><a href="#menuv">Mantenimiento Correctivo</a></li>
<li><a href="#menuv">Instalaci&oacute;n y Configuraci&oacute;n</a></li>
<li><a href="#menuv">Actualizaciones</a></li>
<li><a href="#menuv">Seguridad</a></li>
<li><a href="#menuv">P&oacute;lizas</a></li>
<li><a href="#menuv">Linux / Unix</a></li>
<li><a href="#menuv">Links</a></li>
</ul>
</div>
</table>
</div>

</br>
</td>
<td width="730" valign="top">
<div align="left">

<iframe src="#" name="content" scrolling="no" frameborder="0" width="730" height="950">
</iframe>

</div>
</td>
</tr>
</table>
</center>

</body>
</html>





DE ante mano muchas gracias!