Foros del Web » Creando para Internet » CSS »

Ayuda Menu CSS No se ve en IE

Estas en el tema de Ayuda Menu CSS No se ve en IE en el foro de CSS en Foros del Web. Hola. Me podrian ayudar un poco? no se mucho de CSS. Tengo este menu que en Firefox funciona a la perfeccion, pero en IE no ...
  #1 (permalink)  
Antiguo 05/12/2010, 19:37
Avatar de sniper_lcd  
Fecha de Ingreso: marzo-2007
Mensajes: 53
Antigüedad: 17 años
Puntos: 2
Ayuda Menu CSS No se ve en IE

Hola.

Me podrian ayudar un poco? no se mucho de CSS.

Tengo este menu que en Firefox funciona a la perfeccion, pero en IE no se ve

Este menu, no lo hice yo.....lo hizo otra persona pero ya no supieron como arreglarlo para que funcione en IE. y aqui estoy yo

Este es el CSS

Cita:
* { margin: 0px;
padding: 0px; outline: 0;
}

html, body {
width: 100%;
}

body { background: #fff;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu {
height:39px;
font-size: 0.65em;
width: 761px;
margin: 0px auto;
position:relative;

}
#menu ul {
list-style-type: none;

}

#menu ul li.nivel1 {
text-align: center;
float:left;
width: 93px;
margin-right: 2px;
vertical-align:middle;
background-image:url(../images/fdo.jpg);

}

#menu ul li a {
display: block;
text-decoration: none;
height:35px;
color: #fff;
border: solid 0px;
padding: 8px;
position: relative;
background-image:url(../images/fdo.jpg);
}
#menu ul li:hover {
height: 25px;
position: relative;

}

#menu ul li a:hover, #menu ul li:hover a.nivel1 {

background-image:url(../images/fdo2.jpg);
height:25px;
color: #999;
position:relative;

}

#menu ul li a.nivel1 {
display: block!important;
display: none;
position: relative;
height:23px;
}

#menu ul li ul {

text-align: left;
display: none;
height:25px;
}

#menu ul li a:hover ul, #menu ul li:hover ul {
display: table-column;
position: relative;
left: 0px;
height:25px;
}

#menu ul li ul li a {
width: 250px;
padding: 10px 45px 0px 10px;
border-top-color: #000;
height:25px;


}

#menu ul li ul li a:hover {
border-top-color: #000;
padding: 10px 45px 0px 10px;
height:28px;
}

table.falsa {
border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
y este es el HTML


Cita:
<div id="menu">
<ul>
<li class="nivel1"><a href="acerca.html">Acerca de Integram</a>
<ul>
<li><a href="acerca.html#quienes">¿Quiénes Somos?</a></li>
<li><a href="acerca.html#nosotros">Nosotros</a></li>
<li><a href="acerca.html#mision">Misión</a></li>
<li><a href="acerca.html#vision">Visión</a></li>
<li><a href="acerca.html#valores">Valores</a></li>
<li><a href="acerca.html#antecedentes">Antecedentes</a></li>
</ul>

</li>
<li class="nivel1"><a href="servicios.html">Servicios </a>
<ul>
<li><a href="servicios.html#certificacion">Certificación INTEGRAM</a></li>
<li><a href="servicios.html#talentos">Programa Formación de Talentos</a></li>
<li><a href="servicios.html#desarrollo">Formación Desarrollo Empresarial</a></li>
<li><a href="servicios.html#actualizacion">Programa Actualización Técnica</a></li>
<li><a href="servicios.html#asistenciat">Asistencia Técnica a Distancia</a></li>
<li><a href="servicios.html#asistenciaf">Asistencia a Flotillas</a></li>
<li><a href="servicios.html#sistema">Sistema TSA - Tecnología en Sist. Automotrices</a></li>
</ul>

</li>
<li class="nivel1"><a href="talleres.html" >Talleres Certificados</a>
</li>
<li class="nivel1"><a href="miembros.html" >Miembros de la Comisi&oacute;n</a>

</li>
<li class="nivel1"><a href="cuida.html" >Cuida tu autom&oacute;vil</a> </li>
<li class="nivel1"><a href="eventos.html" >Eventos</a> </li>

<li class="nivel1"><a href="medios.html" >En los medios</a>

</li>
<li class="nivel1"><a href="contacto.html">Contacto<br><br></a> </li>

</ul>
</div>
__________________
MCTS|Sql Server 2005
  #2 (permalink)  
Antiguo 05/12/2010, 20:02
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.774
Antigüedad: 16 años, 1 mes
Puntos: 1146
Respuesta: Ayuda Menu CSS No se ve en IE

si vas a usar uno de los menus del compañero mikmoro, adapta y personaliza lo que necesitas y si falla regresa al codigo original

en concreto te falla porque tiene el texto color blanco y el fondo blanco ¬¬ obio que nunca se vera, despues no se despliega porque tu tienes

Código CSS:
Ver original
  1. #menu ul li a:hover ul, #menu ul li:hover ul {
  2. display: table-column;
  3. position: relative;
  4. left: 0px;
  5. height:25px;
  6. }

y debe ser

Código CSS:
Ver original
  1. #menu ul li a:hover ul, #menu ul li:hover ul {
  2. display: block;
  3. position: relative;
  4. left: 0px;
  5. height:25px;
  6. }

te recomiendo volver a echar un vistaso por los menus de ejemplo que comparte el compañero mikmoro... seguro encontraras el mismo que usaste originalmente para regresar al codigo original

http://www.araudi.net/ejemplos/menus...ables_CSS.html
  #3 (permalink)  
Antiguo 05/12/2010, 20:05
Avatar de sniper_lcd  
Fecha de Ingreso: marzo-2007
Mensajes: 53
Antigüedad: 17 años
Puntos: 2
Respuesta: Ayuda Menu CSS No se ve en IE

Muchas gracias

Sinceramente yo no hice este codigo. pero si me di cuenta que era uno de mikmoro.

solamente que no supe cual usaron :S

dejame revisar los puntos que me comentas

Gracias!
__________________
MCTS|Sql Server 2005
  #4 (permalink)  
Antiguo 05/12/2010, 20:46
Avatar de sniper_lcd  
Fecha de Ingreso: marzo-2007
Mensajes: 53
Antigüedad: 17 años
Puntos: 2
Respuesta: Ayuda Menu CSS No se ve en IE

Me acabo de dar cuenta que ya habia modificado algo de ese codigo

aqui tengo los originales, es el que funciona en Firefox, pero en IE no

Alguien le podria dar un vistazo?

Gracias!

CSS:

Cita:
* { margin: 0px;
padding: 0px; outline: 0;
}

html, body {
width: 100%;
}

body { background: #fff;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu {
height:39px;
font-size: 0.65em;
width: 761px;
margin: 0px auto;
position:absolute;

}
#menu ul {
list-style-type: none;

}

#menu ul li.nivel1 {
text-align: center;
float:left;
width: 93px;
margin-right: 2px;
vertical-align:middle;
background-image:url(../images/fdo.jpg);

}

#menu ul li a {
display: block;
text-decoration: none;
height:35px;
color: #fff;
border: solid 0px;
padding: 8px;
position: relative;
background-image:url(../images/fdo.jpg);
}
#menu ul li:hover {
height: 25px;
position: relative;

}

#menu ul li a:hover, #menu ul li:hover a.nivel1 {

background-image:url(../images/fdo2.jpg);
height:25px;
color: #999;
position: relative;

}

#menu ul li a.nivel1 {
display: block!important;
display: none;
position: relative;
height:23px;
}

#menu ul li ul {

text-align: left;
display: none;
height:25px;
}

#menu ul li a:hover ul, #menu ul li:hover ul {
display: table-column;
position: absolute;
left: 0px;
height:25px;
}

#menu ul li ul li a {
width: 250px;
padding: 10px 45px 0px 10px;
border-top-color: #000;
height:25px;


}

#menu ul li ul li a:hover {
border-top-color: #000;
padding: 10px 45px 0px 10px;
height:28px;
}

table.falsa {
border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
HTML:

Cita:
<div id="menu">
<ul>
<li class="nivel1"><a href="acerca.html" class="nivel1">Acerca de Integram</a>
<!--[if lte IE 6]><a href="http://www.forosdelweb.com" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]-->

<ul>

<li><a href="acerca.html#quienes">¿Quiénes Somos?</a></li>
<li><a href="acerca.html#nosotros">Nosotros</a></li>
<li><a href="acerca.html#mision">Misión</a></li>
<li><a href="acerca.html#vision">Visión</a></li>
<li><a href="acerca.html#valores">Valores</a></li>
<li><a href="acerca.html#antecedentes">Antecedentes</a></li>

</ul>

</li>
<li class="nivel1"><a href="servicios.html" class="nivel1">Servicios </a>
<ul>
<ul>
<li><a href="servicios.html#certificacion">Certificación INTEGRAM</a></li>
<li><a href="servicios.html#talentos">Programa Formación de Talentos</a></li>

<li><a href="servicios.html#desarrollo">Formación Desarrollo Empresarial</a></li>
<li><a href="servicios.html#actualizacion">Programa Actualización Técnica</a></li>
<li><a href="servicios.html#asistenciat">Asistencia Técnica a Distancia</a></li>
<li><a href="servicios.html#asistenciaf">Asistencia a Flotillas</a></li>
<li><a href="servicios.html#sistema">Sistema TSA - Tecnología en Sist. Automotrices</a></li>
</ul>

</ul>

</li>
<li class="nivel1"><a href="talleres.html" class="nivel1">Talleres Certificados</a>
</li>
<li class="nivel1"><a href="miembros.html" class="nivel1">Miembros de la Comisi&oacute;n</a>

</li>
<li class="nivel1"><a href="cuida.html" class="nivel1">Cuida tu autom&oacute;vil</a> </li>


<li class="nivel1"><a href="eventos.html" class="nivel1">Eventos</a> </li>

<li class="nivel1"><a href="medios.html" class="nivel1">En los medios</a>

<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="contacto.html" class="nivel1">Contacto<br><br></a>

</li>

</ul>
</div>
__________________
MCTS|Sql Server 2005

Etiquetas: deslpegable
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:27.