Problema con submenu

Hola foro!, tengo un pequeño problema con un menu desplegable.. el problema radica cuando intento ver el menu en IE6 e IE7 (en ninguna aparece el submenu), pues en la ultima version de dicho explorador se ve bien, en Firefox también se ve correcto.

Les dejo el código a ver si alguien se da cuenta en que anda fallando, gracias.

Código Javascript :

/*MENU*/
li {list-style-type: none}
#main-nav {width:426px; margin: 230px 0 0 0%; float: right;  padding-right: 320px; }
#main-nav li {float:left;}
#main-nav li a {display:block; height:30px; text-indent:-9999px; background-repeat:no-repeat;}

#main-nav a#banda {width:72px;}
#main-nav a#discografia {width:97px; background-position:-72px 0}
#main-nav a#media {width:70px; background-position:-169px 0}
#main-nav a#novedades {width:96px; background-position:-239px 0}
#main-nav a#escribenos {width:91px; background-position:-335px 0}

#main-nav a#banda:hover, #main-nav li:hover a#banda, #main-nav .current a#banda {background-position:0 -72px}
#main-nav a#discografia:hover, #main-nav li:hover a#discografia, #main-nav .current a#discografia {background-position:-72px -72px}
#main-nav a#media:hover, #main-nav li:hover a#media, #main-nav .current a#media {background-position:-169px -72px}
#main-nav a#novedades:hover, #main-nav li:hover a#novedades, #main-nav .current a#novedades {background-position:-239px -72px}
#main-nav a#escribenos:hover, #main-nav li:hover a#escribenos, #main-nav .current a#escribenos {background-position:-335px -72px}

/*SUB-MENU*/
#main-nav li ul {display:none; position:absolute; z-index:100; margin:-11px 0 0 0px; padding:10px;min-width: 145px;}
#main-nav li:hover ul, #main-nav .ie6hover ul {display:block}
#main-nav li ul li {float:none; border-bottom:1px dashed #666; background-image:url(../images/menu_bg.png);}
#main-nav li ul li a{background:none; text-indent:0px; height:auto; padding:8px; font-size: 12px; font-weight:bold; font-family: "Trebuchet MS",Arial, Helvetica, sans-serif; color: #2D2D2D; padding-right:28px;}
#main-nav li ul li a:hover {color:#fff; text-decoration:none; background-image:url(../images/menu_bg.png);}

Código HTML :

<!--MENU-->
<ul id="main-nav">
    <li class="current"><a href="#" id="banda">Banda</a></li>
    
    <li><a href="#" id="discografia">Discografía</a>
      <ul>
            <li><a href="#">Discografía</a></li>
            <li><a href="#">Letras</a></li>    
      </ul>
    </li>
    
    <li><a href="#" id="media">Media</a>
      <ul>
            <li><a href="#">Imágenes</a></li>
            <li><a href="#">Música</a></li>
            <li><a href="#">Videos</a></li>
      </ul>
    </li>
     
    <li><a href="#" id="novedades">Novedades</a>
      <ul>
            <li><a href="#">Prensa</a></li>
            <li><a href="#">Conciertos</a></li>
      </ul>
    </li>
    
    <li class="current"><a href="#" id="escribenos">Escríbenos</a></li>
</ul>

Algo que me pasaba a mí cuando hacía estas cosas es que IE 6 y 7 si mostraban el menú, pero muy lejos de la zona de donde lo había puesto, checa si te aparece un scrollbar horizontal cuando posas el ratón

Hola Aoyama, pues de plano no sale nada, los enlaces de los botones principales si funcionan pero no muestra el contenido del submenu.. y tampoco me aparece el scroll que mencionas en todo caso cómo resolviste tu problema?, derepente puede arreglar el mio

*se va corriendo llorando por todo lo que hace por el IE

el único problema que veo esta en la siguiente linea

Código :

#main-nav li a {display:block; height:30px; text-indent:-9999px;background-repeat:no-repeat;} 

ya que la propiedad text-indentes tiene un valor tan bajo que el texto desaparece de la vista, así que lo que hay que hacer es eliminarla y listo , Si lo que quieres es alinear el el texto un poco a la derecha, es mejor hacerlo dándole un poco de padding. Ademas, ya que el maldito ie6 soporta la pseudo-clase hover solo en los enlaces, es necesario utilizar algo de javascript para poder sortear esta dificultad.

espero que esto solucione el problema.

sney2002 escribió:

Hola Sney, gracias por tu respuesta, pude hacer lo que me comentaste pero queda peor .. los enlaces se descuadran y me aparecen los textos del enlace principal (que no debería aparecer).. talvez por ahi metí la pata, seguiré intentando..

A alguien se le ocurre otra idea para solucionar este problema?

la verdad es que a mi, me funciono perfectamente en el innombrable , pero tal vez fue porque yo no estaba usando imagenes para el backgroud sino colores y eso lo cambia las cosas; si quieres puedes colgar las imagenes para ver que se puede hacer;

*se aleja apenado por no haber podido ayudar en nada

Hola Sney, pues no hay mucho misterio con la imagen para el background del submenú estoy usando esta imagen

Saludos!