Foros del Web » Creando para Internet » CSS »

Sombras que no afectan a elementos cercanos

Estas en el tema de Sombras que no afectan a elementos cercanos en el foro de CSS en Foros del Web. Buenas. Estoy editando el css de una web y le estoy añadiendo sombras a unos elementos, en concreto a la cabecera y al body. El ...
  #1 (permalink)  
Antiguo 23/04/2011, 06:43
 
Fecha de Ingreso: abril-2011
Mensajes: 2
Antigüedad: 13 años, 7 meses
Puntos: 0
Sombras que no afectan a elementos cercanos

Buenas.

Estoy editando el css de una web y le estoy añadiendo sombras a unos elementos, en concreto a la cabecera y al body.
El problema es que la sombra del body afecta a la cabecera, y me gustaria que no saliese en la cabecera. Solo me interesan las sombras laterales.

He probado con z-index y nada.

¿Alguna idea?

Muchas gracias de antemano

Un Saludo
  #2 (permalink)  
Antiguo 23/04/2011, 10:27
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Sombras que no afectan a elementos cercanos

publica el codigo que usas, o un enlace a tu web para mayor información.
Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #3 (permalink)  
Antiguo 23/04/2011, 11:12
Avatar de ZoroRoronoa  
Fecha de Ingreso: marzo-2011
Ubicación: California, USA
Mensajes: 824
Antigüedad: 13 años, 8 meses
Puntos: 116
Respuesta: Sombras que no afectan a elementos cercanos

intenta con:

Código CSS:
Ver original
  1. -moz-box-shadow: 0 1px 3px #161616 , 0px -1px 3px #161616;

Saludos.
__________________
Programador jQuery & PHP
  #4 (permalink)  
Antiguo 23/04/2011, 15:27
 
Fecha de Ingreso: abril-2011
Mensajes: 2
Antigüedad: 13 años, 7 meses
Puntos: 0
Respuesta: Sombras que no afectan a elementos cercanos

Buenas.

Primero que nada muchas gracias a los dos por vuestras respuestas

Os dejo los fragmentos del codigo

Código HTML:
<div class="theme">
	<div id="themebody">
		<div id="head">..</div>
		<div id="banner">..</div>
	</div>
</div> 
Los div en cuestion son el head y el banner. El problema es que la sombra del banner se pone encima del head.

Este es el css:
Código:
.theme #banner{
  box-shadow: 0 0 100px black;
  -webkit-box-shadow: 0 0 100px black;
  -moz-box-shadow: 0 0 100px black;
  width: 1002px; 
  margin: 0 auto;
}
Y esto venia ya con el sistema:
Código:
.theme #head {
	margin-top:15px;
	box-shadow:0 0 100px #000;
	-webkit-box-shadow:0 0 100px #000;
	-moz-box-shadow:0 0 100px #000;
	border-radius:15px 15px 0 0;
	-webkit-border-radius: 15px 15px 0 0;
	-moz-border-radius: 15px 15px 0 0;
}
He probado sustituyendo las sombras de banner y head por "-moz-box-shadow: 0 1px 3px #161616 , 0px -1px 3px #161616;" como me comento ZoroRoronoa y sigo con el mismo problema.

La verdad que llevo un par de dias mirando y remirando el codigo y no se que es lo que puede ser, ni porque pasa, ni como solucionarlo. Como ya he dicho he probado con los z-index y nada. He estado mirando el resto de los div de la web y por ejemplo el footer tiene sombra tambien y esta no se sobrepone al contenido del body. Y lo he hecho igual que con el banner y el head.

¿Alguien que sea capaz de aportarme un rayo de esperanza?

Muchas gracias de nuevo!

Un Saludo

Etiquetas: elementos
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 21:29.