Foros del Web » Creando para Internet » CSS »

Menu css, funciona en FF pero no en IE, me ayudan?

Estas en el tema de Menu css, funciona en FF pero no en IE, me ayudan? en el foro de CSS en Foros del Web. Otra vez con lo mismo... Ya probe con las soluciones que dio en su mometo el usuario Mikmoro.. pero no hay caso... me tomo el ...
  #1 (permalink)  
Antiguo 01/02/2010, 11:39
 
Fecha de Ingreso: marzo-2007
Mensajes: 30
Antigüedad: 17 años
Puntos: 0
Menu css, funciona en FF pero no en IE, me ayudan?

Otra vez con lo mismo...

Ya probe con las soluciones que dio en su mometo el usuario Mikmoro.. pero no hay caso...

me tomo el atrevimiento de postear mi css y el htm...

CSS:
Código:
@charset "utf-8";
/* CSS Document */

/*^'^ Navigation Structure ^'^*/
.nav-container-outer{
	background: #990000;
	padding: 0px;
	height: 50px;
	background: url(images/nav-bg.jpg);
}
.float-left{
float: left;
}
.float-right{
float: right;
}
.nav-container .divider{
display:block;
font-size:1px;
border-width:0px;
border-style:solid;
}
.nav-container .divider-vert{
float:left;
width:0px;
display: none;
}
.nav-container .item-secondary-title{
display:block;
cursor:default;
white-space:nowrap;
}
.clear{
font-size:1px;
height:0px;
width:0px;
clear:left;
line-height:0px;
display:block;
float:none;
}
.nav-container{
	position:relative;
	zoom:1;
	margin: 0 auto;
}
.nav-container a, .nav-container li{
float:left;
display:block;
white-space:nowrap;
}
.nav-container div a, .nav-container ul a, .nav-container ul li{
	float:none;
	background-color: #96BFD6;
}
.nav-container ul{
	left:-10000px;
	position:absolute;
	background-color: #00CC66;
}
.nav-container, .nav-container ul{
	list-style:none;
	padding:0px;
	margin:0px;
}
.nav-container li a{
float:none
}
.nav-container li{
position:relative;
}
.nav-container ul{
	z-index:10;
	background-color: #96BFD6;
}
.nav-container ul ul{
z-index:20;
}
.nav-container ul ul ul{
z-index:30;
}
.nav-container ul ul ul ul{
z-index:40;
}
.nav-container ul ul ul ul ul{
z-index:50;
}
li:hover>ul{
	left:auto;
	background-color: #0000CC;
}
#nav-container ul {
	top:100%;
}
#nav-container ul li:hover>ul{
	top:0px;
	left:100%;
	background-color: #FFFFFF;
}

/*^'^ Primary Items ^'^*/	
#nav-container a{	
padding:7px 17px 7px 18px;
margin: 10px 0px 0px 0px;
color: #FFFFFF;
font-family: Trebuchet MS, Arial, sans-serif, Helvetica;
font-size:14px;
text-decoration:none;
font-weight: bold;
background: url(images/item-primary-bg.gif);
background-repeat: no-repeat;
background-position: top;
}

#nav-container a:hover{
	color: #FF6600;
	background: url(images/item-primary-bg.gif);
	background-repeat: no-repeat;
	background-position: center;
}

/*^'^ Secondary Items Container ^'^*/	
#nav-container div, #nav-container ul{
	padding:10px 4px 10px 4px;
	margin:0px 0px 0px 0px;
	background: url(images/item-secondary-container-bg.jpg);
	background-repeat: repeat-x;
	background-color: #96BFD6;
	border-bottom: 1px solid #CA6500;
}

/*^'^ Secondary Items ^'^*/	
#nav-container div a, #nav-container ul a{	
padding:3px 10px 3px 6px;
background-color: #FFFFFF;
background: url(images/item-secondary-bg.jpg);
background-repeat: no-repeat;
background-position: 0px 22px;
font-size:11px;
border-width:0px;
border-style:none;
margin: 0px 0px 0px 0px;
width: 149px;
}

/*^'^ Secondary Items Hover State ^'^*/	
#nav-container div a:hover, #nav-container ul a:hover{	
background-color: #FFFFFF;
background: url(images/item-secondary-bg.jpg);
background-repeat: no-repeat;
color:#CC0000;
}

/*^'^ Secondary Item Titles ^'^*/	
#nav-container .item-secondary-title{	
cursor:default;
padding:4px 0px 3px 7px;
color: #6C3600;
font-family: Arial, Trebuchet MS, Arial, sans-serif, Helvetica;
font-size:11px;
/* background: url(images/item-secondary-title-bg.jpg); */
background-repeat: no-repeat;
font-weight:bold;
}

/*^'^ Horizontal Dividers ^'^*/	
#nav-container .divider-horiz{	
border-top-width:1px;
margin:5px 5px;
border-color: #C16100;
}

/*^'^ Vertical Dividers ^'^*/	
#nav-container .divider-vert{	
border-left-width:1px;
height:15px;
margin:4px 2px 0px 2px;
border-color:#AAAAAA;
}
y el HTML:
Código:
<div class="nav-container-outer"><img src="/menu/images/nav-bg-l.jpg" alt="" width="25" height="52" class="float-left" />
       <img src="/menu/images/nav-bg-r.jpg" alt="" width="25" height="52" class="float-right" />
   <ul class="nav-container" id="nav-container" name="nav-container">
      <li><a class="item-primary" href="instit.htm" target="_self">Institucional<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
         </a><ul style="width:166px;"><li>
            <a class="item-primary" href="instit.htm" target="_self"></a><a href="index.htm" title="Principal" target="_self" >Principal</a></li>
            <li><a href="oport.htm" title="Oportunidades Laborales" target="_self" >Oportunidades Laborales</a></li>
            <li><a href="prensa.htm" title="Prensa" target="_self" >Prensa</a></li>
            <li><a href="convenios.htm" title="Convenios" target="_self" >Convenios</a></li>
         </ul>
         <!--[if lte IE 6]></td></tr></table></a><![endif]-->
	   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="cursos.htm" target="_self">Cursos</a>
         <ul style="width:166px;">
            <li><a href="cursos_regulares.htm" title="Regulares" target="_self" >Regulares</a></li>
            <li><a href="cursos_intensivos.htm" title="Intensivos" target="_self" >Intensivos</a></li>
            <li><a href="cursos_especiales.htm" title="Especiales" target="_self" >Especiales</a></li>
            <li><a href="empresas.htm" title="Empresas" target="_self" >Empresas</a></li>
            <li><a href="cursos_espbras.htm" title="Español para Brasileños" target="_self" >Español para Brasileños</a></li>
         </ul>
	   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="#" target="_self">Celpe-Bras</a>
         <ul style="width:166px;">
            <li><a href="info_celpe.htm" title="Información" target="_self" >Información</a></li>
            <li><a href="insc_celpe.htm" title="Inscripción" target="_self" >Inscripción</a></li>
            <li><a href="curso_celpe.htm" title="Curso Preparatorio" target="_self" >Curso Preparatorio</a></li>
         </ul>
	   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="libreria.htm" target="_self">Librería</a>
         <ul style="width:166px;">
            <li><a href="cat_literat.htm" title="Literatura" target="_self" >Literatura</a></li>
            <li><a href="cat_cultura.htm" title="Cultura" target="_self" >Cultura</a></li>
            <li><a href="cat_mus.htm" title="Música" target="_self" >Música</a></li>
            <li><a href="cat_lingua.htm" title="Portugués Língua Extrangeira" target="_self" >Portugués Língua Extrangeira</a></li>
            <li><a href="pop_oferta.htm" title="Oferta del mes" target="_blank" >Oferta del mes</a></li>
            <li><a href="pop_novedades.htm" title="Novedades" target="_blank" >Novedades</a></li>
         </ul>
	   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="biblioteca.html" target="_self">Biblioteca</a>	   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="ple.htm" target="_self">Formaci&oacute;n de Profesores</a>
         <ul style="width:166px;">
            <li><a href="seminarios.htm" title="Seminarios de Actualización" target="_blank" >Seminarios de Actualización</a></li>
            <li><a href="ple_2005.htm" title="Ple 2005" target="_blank" >Ple 2005</a></li>
            <li><a href="ple_2006.htm" title="Ple 2006" target="_blank" >Ple 2006</a></li>
            <li><a href="misiones.htm" title="Seminario Misiones" target="_blank" >Seminario Misiones</a></li>
            <li><a href="siple_autoridades.htm" title="SIPLE - Nuevas Autoridades" target="_blank" >SIPLE - Nuevas Autoridades</a></li>
         </ul>
	   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li class="clear"> </li>
   </ul>
</div>
disculpen si es muy largo...
Quizas no se les vea bien porque usa imagenes para darle el formato gráfico...
Si los necesitan, [URL="http://www.filefactory.com/file/a2hf2fe/n/menu.rar"][B][COLOR="SeaGreen"]acá estan[/COLOR][/B][/URL].
Ojala puedan ayudarme en el problema puntual que en el Explorer 6 no aparecen los submenues que se descuelgan del principal.

Fijense que en el primer link principal (que se llama Institucional) hice la prueba con <!--[if gte IE 7]><!--> y la otra etiqueta para el IE6.. y no anduvo...

Mil gracias de antemano.

Última edición por phsnany; 01/02/2010 a las 11:41 Razón: olvide un detalle
  #2 (permalink)  
Antiguo 01/02/2010, 11:49
(Desactivado)
 
Fecha de Ingreso: enero-2010
Mensajes: 83
Antigüedad: 14 años, 2 meses
Puntos: 1
Respuesta: Menu css, funciona en FF pero no en IE, me ayudan?

mira yo me imagino que utilizaste capas div que que aparecen haciendo algo. eso creo que o sirve muyy bien con internet explorer
  #3 (permalink)  
Antiguo 01/02/2010, 13:18
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.698
Antigüedad: 14 años, 9 meses
Puntos: 137
Respuesta: Menu css, funciona en FF pero no en IE, me ayudan?

ie solo interpreta la pseudo clase :hover a elementos <a>
para solucionarlo te recomiendo agregar

http://code.google.com/p/ie7-js/

o bien este spcript de 3k que arregla solo ese problema en concreto y un par de mas

http://www.xs4all.nl/~peterned/csshover.html
__________________
Toroflix - movies.
  #4 (permalink)  
Antiguo 01/06/2010, 01:34
 
Fecha de Ingreso: julio-2006
Mensajes: 206
Antigüedad: 17 años, 8 meses
Puntos: 2
Respuesta: Menu css, funciona en FF pero no en IE, me ayudan?

Hola buenas! Estoy teniendo el mismo problema con Explorer 6, q no me despliega los submenus, y es q en el ejemplo que expone alexK:

http://www.xs4all.nl/~peterned/examples/cssmenu.html#

Tampoco lo soluciona para Explorer 6, como podría solucionarse esto en Explorer 6??

Un saludo
  #5 (permalink)  
Antiguo 01/06/2010, 12:12
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.698
Antigüedad: 14 años, 9 meses
Puntos: 137
Respuesta: Menu css, funciona en FF pero no en IE, me ayudan?

Cita:
Iniciado por Luis10 Ver Mensaje
Hola buenas! Estoy teniendo el mismo problema con Explorer 6, q no me despliega los submenus, y es q en el ejemplo que expone alexK:

http://www.xs4all.nl/~peterned/examples/cssmenu.html#

Tampoco lo soluciona para Explorer 6, como podría solucionarse esto en Explorer 6??

Un saludo
seguramente algo llevas mal, que las 2 alternativas funcionan perfectamente
__________________
Toroflix - movies.
  #6 (permalink)  
Antiguo 02/06/2010, 00:32
 
Fecha de Ingreso: julio-2006
Mensajes: 206
Antigüedad: 17 años, 8 meses
Puntos: 2
Respuesta: Menu css, funciona en FF pero no en IE, me ayudan?

Cita:
Iniciado por alexk Ver Mensaje
seguramente algo llevas mal, que las 2 alternativas funcionan perfectamente
Joder...hoy lo he vuelto a probar en ie6 y si me ha funcionado... de todas formas aporto un enlace más que he visto.

http://freelancermagazine.com/The_Ul.../template.html

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:37.