Re: [Ovillo] A vueltas con el dichoso menú: width de hover.

Mon, 11 Jul 2005 00:41:11 -0700 

Es de sobra ya conocido, que microsoft y otros navegadores no tratan igual 
el "padding" y el "margin". Para ello te envio el enlace que siempre se 
utiliza:
http://www.disenorama.com/articulos/css/el_modelo_de_cajas.htm

Asi que creo que el problema esta en la clase que defines "#menu a {" porque 
lo aplicas a la capa y a la vez al enlace. Prueba a jugar con el atributo 
"padding" y cambia el valor último (left) de 17px a 0px. Verás que mientras 
firefox desplaza todo el menu 17px a la derecha, explorer sólo lo hace con 
el texto. Asi que pienso que lo mejor es que le apliques las propiedades de 
espacio al "ul" y no a la capa.


El día 28/06/05, luis cruz salanova <[EMAIL PROTECTED]> escribió:
> 
> Mandé hace ya como una hora este mismo mensaje a la
> lista, como creo que hubo algún problema en el envío
> lo hago de nuevo. Pido disculpas por anticipado si
> llegase repetido.
> 
> Hola, perdonen que les de la lata de nuevo con el
> dichoso asunto del
> menú, apenas estoy empezando con el css y además lo
> hago muy lento por
> falta de tiempo.
> El caso es que no doy con la razón por la cual el
> background de las
> imágenes en estado "hover" en firefox me ocupa todo el
> ancho de la
> capa (incluso un poco más en este caso, está hecho
> aposta) pero en
> explorer bastante menos.
> 
> El menú es este:
> http://es.geocities.com/eltransito03/menuproductos2.htm
> Y el código este:
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
> Transitional//EN">
> <html>
> <head>
> <title>Documento sin t&iacute;tulo</title>
> <meta http-equiv="Content-Type" content="text/html;
> charset=iso-8859-1">
> <style type="text/css">
> h3{
> font-family: Tahoma;
> font: 14px;
> color: #696;
> font-weight: bold;
> margin-left: 4px;
> 
> }
> #menu{
> border: 0px;
> width: 203px;
> height:auto;
> background-image:
> url(http://es.geocities.com/eltransito03/imagenes/background.jpg);
> background-repeat: repeat-y;
> margin: 0%;
> padding: 0%;
> font-family: Tahoma
> }
> #menu ul {
> list-style: none;
> margin: 0;
> padding: 0;
> font: 12px;
> 
> }
> #menu a { display: block;
> color: #88ca8c;
> width: 185px;
> padding: 3px 3px 3px 17px;
> text-decoration: none;
> border-bottom: 1px solid #fff;
> }
> #menu a:hover
> {
> background-color: #ffedc9;
> color: #FFF;
> font-weight: bold;
> }
> #menu li { margin: 0;
> }
> 
> </style>
> </head>
> <body>
> <div id="menu"><img
> src="http://es.geocities.com/eltransito03/imagenes/supmenu.jpg";>
> <ul>
> <li>
> <h3><img
> src="http://es.geocities.com/eltransito03/imagenes/bullet.jpg";>Item1</h3>
> </li>
> <ul>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> </ul>
> <li>
> <h3><img
> src="http://es.geocities.com/eltransito03/imagenes/bullet.jpg";>Item2</h3>
> </li>
> <ul>
> <li><a href="#">subitem</a></li>
> </ul>
> <li>
> <h3><img
> src="http://es.geocities.com/eltransito03/imagenes/bullet.jpg";>item3</h3>
> </li>
> <ul>
> <li><a href="#">subitem</a></li>
> <li><a href="#">subitem</a></li>
> </ul>
> </ul>
> <img
> src="http://es.geocities.com/eltransito03/imagenes/prod_menu_catalog2.jpg";
> >
> </div>
> </body>
> </html>
> Un saludo y les agradecería sugerencias. Gracias.
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
> http://ovillo.org/mailman/listinfo/ovillo
> 



-- 
Salu2:
MARTIN desde Valencia (ESPAÑA)
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://ovillo.org/mailman/listinfo/ovillo

Responder a