Foros del Web

Foros del Web (http://www.forosdelweb.com/)
-   CSS (http://www.forosdelweb.com/f53/)
-   -   enviar capa absoluta al fondo... (http://www.forosdelweb.com/f53/enviar-capa-absoluta-fondo-543654/)

Snd234 26/12/2007 21:42
enviar capa absoluta al fondo...
 
Hola, queria consultar si es posible enviar una capa con posicion absoluta al fondo. Mejor lo explico con un ejemplo...

http://www.kibit.cl/ejemplos/css/tags.html

En esa pagina tengo el siguiente codigo:

Código:
<div id="tags">
    <div id="tags_main">
        <div id="tags_top"></div>
        <div id="tags_content">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
    </div>
    <div id="tags_bottom"></div>
</div>
Y el siguiente estilo:
Código:
#tags {
    width: 730px;
    margin: 0px auto;
}

#tags_content {
    padding: 0px 16px;
}

#tags_top {
    height: 32px;
    width: 730px;
    background-image: url(images/tags_top_bg.png);
    background-position: top;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 2;
}

#tags_main {
    background-image: url(images/tags_main_bg.png);
    background-position: top;
    background-repeat: repeat-y;
}

#tags_bottom {
    height: 10px;
    background-image: url(images/tags_bottom_bg.png);
    background-position: center;
    background-repeat: no-repeat;
}
El problema, es que quiero enviar la capa #tags_top al fondo para que el texto que tiene la capa #tags_content se vea por encima, y de esa forma el degrado quede siempre arriba y el texto comienze desde alli...

Es posible solucionarlo?

caricatos 27/12/2007 01:46
Re: enviar capa absoluta al fondo...
 
Hola:

Al ponerle un z-index superior, estás poniendo la capa al frente... y por la distribución de tus capas, simplemente bastaría quitando ese estilo...

Pruébalo y nos cuentas.

Saludos :arriba:

Snd234 27/12/2007 09:53
Re: enviar capa absoluta al fondo...
 
Pero el z-index se aplica en caso de bajer 2 o mas capas con posicion absoluta, en este caso solo tengo una... :neurotico

webosiris 27/12/2007 14:20
Re: enviar capa absoluta al fondo...
 
Cita:
Iniciado por Snd234 (Mensaje 2229541)
Pero el z-index se aplica en caso de bajer 2 o mas capas
no, todos los elementos tienen z-index, aún aquellos en donde no los tienen explícito el navegador aplica un z-index auto, que es igual al z-index del elemento padre.

ponle un z-index negativo y ya estaría (aunque igual creo que usar 5 capas para lo que estas haciendo es complicarse demasiado)...

Snd234 27/12/2007 15:19
Re: enviar capa absoluta al fondo...
 
Es que... de que otra forma se podria hacer?
La idea es que el contenido cresca y el fondo se siga manteniendo, el color y borde de la imagen...

Su fuera el contenido fijo solo podria una capa y la imagen de fondo y listo pero en este caso es dinamico...

juaniquillo 27/12/2007 17:29
Re: enviar capa absoluta al fondo...
 
El problema que tienes es algo que nunca he podido resolver, pero te puedo dar una de las alternativa de las cuales me he tenido que valer debido a ese mismo problema. Puedes usar márgenes negativos en el div del contenido. Solo tienes que cambiar estos dos classes:
Código HTML:
#tags_content {
    margin-top:-25px;
    padding: 0px 16px;
}

#tags_top {
    height: 32px;
    background-image: url(images/tags_top_bg.png);
    background-position: top;
    background-repeat: no-repeat;
}
yo le puse -25px como ejemplo pero tu puedes ponerle cuanto necesites.


La zona horaria es GMT -6. Ahora son las 09:03.

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2026, Jelsoft Enterprises Ltd.