Re: [Ovillo] Enviar una capa detras de otro
Hola,
Reynier Perez Mira escribió:
Como muchos habrán podido ver estaba tratando de crear un modelo en el cual
se de la impresión al usuario de que una imagen pasa por encima de una barra.
Eso ya lo he logrado pero no del todo. El problema es que la capa ubicada a
la derecha me pasa por encima de la otra y me corta una esquina de la imagen.
Tengo entendido que la propiedad z-index podria resolver mi problema pero al
parecer la estoy usando mal. Según estudié en estos días si tengo lo
siguiente:
#div1 {
z-index:1;
}
#div2 {
z-index:2;
}
#div3 {
z-index:2;
}
Y supuestamente segun lo que entendi y dije anteriormente el DIV topnavR y
topnavL se me ubican siempre por encima del DIV Cabecera. ¿Qué es lo que
estoy haciendo mal?
Si lo que buscás es que la cabecera quede por encima de los demás divs,
debe tener un valor mayor en z-index.
Te preparé una demostración sencilla: http://27sur.com/ovillo/z-index.html
Saludos,
--
Camilo Kawerín
___
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
Re: [Ovillo] Enviar una capa detras de otro
Despues de varias horas nalgas frente a la PC y lidiando con la triada
TopStyle + CSS Vista + Firefox he logrado solucionar el problema del
posicionamiento pero aun no logro solucionar el de las letras o enlaces que van
en los divs topnavR y topnavL. Aqui el CSS haber si me dicen en que parte estoy
metiendo la pata:
div#CabeceraL {
position: absolute;
width: 569px; height: 185px;
background: url(../../simpro_final/images/banner_simpro.png) no-repeat
left;
float: left;
border: 2px solid #F0E68C;
z-index: 1;
}
div#CabeceraR {
position: absolute;
width: 180px; height: 185px;
left: 575px;
float: left;
border: 2px solid Red;
}
/*Barra de navegación superior - ubicada encima de la cabecera*/
div#topnavL {
position: absolute;
width: 50%;
top: 0;
background: url(../../simpro_final/images/toolbar_bg.jpg) repeat-x;
text-align: left;
line-height: 25px;
float: left;
z-index: 0;
}
Salu2
--
ReynierPM
4to. Ing. Informática
Linux User: #310201
El programador superhéroe aprende de compartir sus conocimientos. Es el
referente de sus compañeros. Todo el mundo va a preguntarle y él, secretamente,
lo fomenta porque es así como adquiere su legendaria sabiduría: escuchando
ayudando a los demás...
___
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] Enviar una capa detras de otro
Como muchos habrán podido ver estaba tratando de crear un modelo en el cual se
de la impresión al usuario de que una imagen pasa por encima de una barra. Eso
ya lo he logrado pero no del todo. El problema es que la capa ubicada a la
derecha me pasa por encima de la otra y me corta una esquina de la imagen.
Tengo entendido que la propiedad z-index podria resolver mi problema pero al
parecer la estoy usando mal. Según estudié en estos días si tengo lo siguiente:
#div1 {
z-index:1;
}
#div2 {
z-index:2;
}
#div3 {
z-index:2;
}
Los DIV con ID div2 y div3 deben estar por encima de la capa con ID div1,
correcto? Bien mi CSS es como sigue:
/*DIV donde se ubica la cabecera*/
div#Cabecera {
position: relative;
width: 760px;
height: 185px;
background: url(../../simpro_final/images/banner_simpro.png) no-repeat
left;
z-index: 1;
}
/*Barra de navegación superior - ubicada encima de la cabecera*/
div#topnavL {
position: absolute;
width: 50%;
top: 0;
background: url(../../simpro_final/images/toolbar_bg.jpg) repeat-x;
text-align: left;
line-height: 25px;
float: left;
z-index: 2;
}
div#topnavR {
position: absolute;
width: 44.3%;
top:0;
background: url(../../simpro_final/images/toolbar_bg.jpg) repeat-x;
text-align: left;
line-height: 25px;
left:35.3em;
z-index: 2;
}
Y supuestamente segun lo que entendi y dije anteriormente el DIV topnavR y
topnavL se me ubican siempre por encima del DIV Cabecera. ¿Qué es lo que estoy
haciendo mal?
Salu2
--
ReynierPM
4to. Ing. Informática
Linux User: #310201
El programador superhéroe aprende de compartir sus conocimientos. Es el
referente de sus compañeros. Todo el mundo va a preguntarle y él, secretamente,
lo fomenta porque es así como adquiere su legendaria sabiduría: escuchando
ayudando a los demás...
___
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
