CSS - Capa de fondo visible

   
Vista:

Capa de fondo visible

Publicado por localhost (3 intervenciones) el 19/02/2013 10:15:44
Hola, a todos, a ver tengo un problemilla, estoy haciendo una web y estoy utilizando capas, como habiamos echo un diseño gráfico anterior al diseño web, he cogido todo lo que se repite en todas las secciones y lo he puesto de imagen de fondo en la capa contenedor, de manera que no tenga q utilizar tantas capas, pero el problema viene cuando voy a meter una imagen en la capa del cuerpo, la cual está dentro del contenedor, que me tapa el pie de la pagina, y no quiero que me lo tape.

He utilizado position: absolute en ambas capas y el fondo que quiero que resalte le he puesto z-index: 50 y a la del cuerpo le he puesto z-index: 1, pero no se poque demonios la capa cuerpo no se queda detrás del contenedor. Alguien me puede echar un cable?? os lo agradezco enormemente. Un saludo y por si sirve de algo dejo el codigo de ambas capas.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
#contenedor{
	width: 960px;
	height: 671px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -335px;
	margin-left: -480px;
	float: left;
	overflow: auto;
	background-color: transparent;
	background-image:url(../imagenes/fondo.gif);
	background-repeat:no-repeat;
	z-index: 50;
}
#cuerpo{
	width: 100%;
	height: 590px;
	float: left;
	position: absolute;
	margin-top: 80px;
	background-image:url(../imagenes/fondo1.jpg);
	z-index: 1;
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Capa de fondo visible

Publicado por xve (349 intervenciones) el 19/02/2013 22:05:54
Hola, como no tengo las imágenes a las que haces referencia, he puesto color de fondo a los divs, y he comentado algunas cosas para poder verlo correctamente como los float... ya que su posición es absolute...

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<style>
#contenedor{
        width: 300px;
        height: 300px;
        position: absolute;
/*        left: 50%;
        top: 50%;*/
/*         float: left; */
/*         overflow: auto; */
        background-color: #00f;
/*         background-image:url(../imagenes/fondo.gif); */
        background-repeat:no-repeat;
        z-index: -1;
}
#cuerpo{
        width: 400px;
        height: 400px;
/*         float: left; */
        position: absolute;
/*         margin-top: 80px; */
        background-color:#f00;
/*         background-image:url(../imagenes/fondo1.jpg); */
        z-index: 1;
}
</style>
 
<div id="cuerpo"></div>
<div id="contenedor"></div>

Tal como esta este código, el que manda sobre la posición de la capa es el z-index.
Como no se muy bien que imágenes son, ni donde va todo esto, no se si te he podido ayudar... Si copias el código tal cual, veras que se funciona.

Coméntanos, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Capa de fondo visible

Publicado por Localhost (3 intervenciones) el 24/02/2013 18:45:54
Muchas gracis por tu ayuda al final solucione el problema repitiendo la imagen del pie en otra capa encima y funciona, ya no lo modifico mas, jaja, de una quien forma muchas gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar