Hola a todos, tengo un problema, tengo 2 menus en mi pagina y uno de ellos no me funciona en IE despues de añadir el segundo; me explico:
Tenía un un menu vertical css:
Código:
/* Menu Ctegories */
ul.catmenu {
margin: 0;
padding: 0;
list-style: none;
width: 170px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
}
ul.catmenu li.catmenu {
position: relative;
}
li.catmenu ul.catmenu {
position: absolute;
left: 169px; /* Set 1px less than menu width */
top: 0;
display: none;
}
/* Styles for Menu Items */
ul.catmenu li.catmenu a {
display: block;
text-decoration: none;
color: #777;
background: #fff; /* IE6 Bug */
padding: 5px;
border: 1px solid #ccc; /* IE6 Bug */
border-bottom: 0;
}
/* Styles for Menu Items hover */
ul.catmenu li.catmenu a:hover {
display: block;
text-decoration: none;
color: #777;
background: #C7D0A6; /* IE6 Bug */
padding: 5px;
border: 1px solid #ccc; /* IE6 Bug */
border-bottom: 0;
}
/* Holly Hack. IE Requirement \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
li.catmenu:hover ul.catmenu, li.catmenu.over ul.catmenu { display: block; } /* The magic */
body {
font: normal 11px verdana; behavior:url("/tienda/templates/deafault/csshover.htc");
}
li.catmenu:hover ul.catmenu ul.catmenu, li.catmenu.over ul.catmenu ul.catmenu {display: none;} /* ‘¯àïâ*âì ¯®€¬¥*î 3-£® ã஢*ï */
ul.catmenu ul.catmenu li.catmenu:hover ul.catmenu, ul.catmenu ul.catmenu li.catmenu.over ul.catmenu {display: block;} /* ®ª*§*âì ¯®€¬¥*î 3-£® ã஢*ï */
/* Menu Ctegories */
Y me funcionaba perfectamente en Firefox, opera, ie6, vamos todo;
Pero luego añadi un menu horizontal a mi web:
Código:
/*menu horizontal*/
.menu1 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(images/button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu1 li {float:left;}
.menu1 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;}
.menu1 li a b {float:left; display:block; padding:0 16px 0 8px;}
.menu1 li.current a {color:#fff; background:url(images/button3.gif);}
.menu1 li.current a b {background:url(images/button3.gif) no-repeat right top;}
.menu1 li a:hover {color:#fff; background:#000 url(images/button2.gif);}
.menu1 li a:hover b {background:url(images/button2.gif) no-repeat right top;}
.menu1 li.current a:hover {color:#fff; background:#000 url(images/button3.gif); cursor:default;}
.menu1 li.current a:hover b {background:url(images/button3.gif) no-repeat right top;}
.menu1 li.espacio a {float:right;}
.menu1 li.espacio a b {}
.usuario {
padding: 0px 20px 4px 0px;
font-size:11px;
font-weight:bold;
color:#000;
float:right;
height:35px;
line-height:35px;
color:#fff;
text-decoration:none;
font-size:11px;
}
/*menu horizontal*/
Cuando añadi este segundo menu, el primero (vertical), me dejo de funcionar en ie6-7, no se por que, no lo consigo solucionar. Alguna idea...?
Gracias, Salu2.