[Ovillo] problema con z-index en Internet explorer
Hola, tengo un problema. Estoy desarrollando una aplicación con ruby on rails y tengo un campo de texto que funciona como google suggest, un autocompletar. En firefox, cuando sale la capa, funciona correctamente, pero en IE una parte de la capa se queda detrás de la siguiente. El código lo tengo así: ... // . El resultado está aquí: http://i38.photobucket.com/albums/e122/vilec/pantalla_autocompleter-1.jpg El caso es que cuando se hace la búsqueda, el resultado se mete en la primera capa. Según tengo entendido, las propiedades son heredables por lo que según lo tengo debería ir y no sé por qué no va. ¿Alguna sugerencia? ___ 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://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] problema con z-index
me respondo yo mismo:
solo agrego a la clase #menu-p {z-index:2; position:relative}
el siguiente valor: ; width:100%;
quedando así:
#menu-p {z-index:2; position:relative; width:100%; }
que simple!!!
pero llevo alredor 8 horas
gracias de todas maneras, si alguien encuentra una solución mejor,
será acogida con gusto
nos vemos
On 7/19/06, Escael Marrero <[EMAIL PROTECTED]> wrote:
> hola lista
> escribo poco a la lista y menos para pregunatr priemro agoto todo los
> recursos y este es uno de esos casos
> tengo el siguiente problema y todo gracias a nuestro "querido IE"
> deseo superponer dos capas en firefox una, la que deseo, se pone por
> encima, en IE por debajo, cosa que no quiero, aqui adjunto un ejemplo
> visual:
> veanlo en los dos navegadores para que se den cuenta. fijense en el
> enlace INICIO
>
> ejemplo perfecto en firefox:
> http://www.juventudrebelde.cu/test/ff.png
>
> ejemplo maldito en IE:
> http://www.juventudrebelde.cu/test/ie.png
>
> pongo el css y el codigo html (he simplificado los codigos del ejemplo
> que adjunto para que se entienda mejor, pero en la imagen pueden ver
> lo que quiero lograr)
>
>
> * {margin:0; padding:0;}
> body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:62.5%;}
> #container {background:#fff; width:99%; margin:0.5% auto; border:1px
> solid #ccc;}
> #head {border-bottom:1px solid #ccc; padding:3px;}
> #menu img {border: none;}
> #menu {/*float:left;*/ width:100%; font-size:1.2em; line-height:normal; }
> #menu ul {margin:0; padding:10px 10% 0 10%; list-style:none; }
> #menu li {display:inline; }
> #menu a { margin:0 1px;float:left; padding:0 0 0
> 7px;text-decoration:none;/*border-bottom:1px solid #ccc;*/}
> #menu a span {float:left; display:block; background:#ccc; padding:5px
> 15px 4px 6px; color:#333; }
>
> #menu a span {float:none;}
>
> #menu a:hover span {color:#99;}
> #menu a:hover {background-position:0% 0px;height:100%;}
> #menu a:hover span {background-position:100% 0px;}
> #menu #current /*a*/ span {background:blue; }
> #submenu {border-top:1px solid #ccc; background:#e9e9e9;
> top:-4px!important; top:-7px; z-index:0; position:relative;}
> #menu-p {z-index:100; position:relative; }
> .clear {clear:both;}
>
>
>
>
>
>
>
>
> href="Home.html">Inicio
> Noticias
> Complementos
> href="Support.html">Administración
> Opciones
>
>
>
> submenu
>
>
>
> espero me puedan ayudar
> saludos
> --
> Escael Marrero
> Desarrollador web
>
--
Escael Marrero
Desarrollador web
___
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
[Ovillo] problema con z-index
hola lista
escribo poco a la lista y menos para pregunatr priemro agoto todo los
recursos y este es uno de esos casos
tengo el siguiente problema y todo gracias a nuestro "querido IE"
deseo superponer dos capas en firefox una, la que deseo, se pone por
encima, en IE por debajo, cosa que no quiero, aqui adjunto un ejemplo
visual:
veanlo en los dos navegadores para que se den cuenta. fijense en el
enlace INICIO
ejemplo perfecto en firefox:
http://www.juventudrebelde.cu/test/ff.png
ejemplo maldito en IE:
http://www.juventudrebelde.cu/test/ie.png
pongo el css y el codigo html (he simplificado los codigos del ejemplo
que adjunto para que se entienda mejor, pero en la imagen pueden ver
lo que quiero lograr)
* {margin:0; padding:0;}
body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:62.5%;}
#container {background:#fff; width:99%; margin:0.5% auto; border:1px
solid #ccc;}
#head {border-bottom:1px solid #ccc; padding:3px;}
#menu img {border: none;}
#menu {/*float:left;*/ width:100%; font-size:1.2em; line-height:normal; }
#menu ul {margin:0; padding:10px 10% 0 10%; list-style:none; }
#menu li {display:inline; }
#menu a { margin:0 1px;float:left; padding:0 0 0
7px;text-decoration:none;/*border-bottom:1px solid #ccc;*/}
#menu a span {float:left; display:block; background:#ccc; padding:5px
15px 4px 6px; color:#333; }
#menu a span {float:none;}
#menu a:hover span {color:#99;}
#menu a:hover {background-position:0% 0px;height:100%;}
#menu a:hover span {background-position:100% 0px;}
#menu #current /*a*/ span {background:blue; }
#submenu {border-top:1px solid #ccc; background:#e9e9e9;
top:-4px!important; top:-7px; z-index:0; position:relative;}
#menu-p {z-index:100; position:relative; }
.clear {clear:both;}
Inicio
Noticias
Complementos
Administración
Opciones
submenu
espero me puedan ayudar
saludos
--
Escael Marrero
Desarrollador web
___
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
