Foros del Web » Creando para Internet » CSS »

Capa simple, pero no sé como hacerlo...

Estas en el tema de Capa simple, pero no sé como hacerlo... en el foro de CSS en Foros del Web. Buenas, no sé que tipo de position debo ponerle a una capa, me explico. Tengo 3 capas, del mismo ancho, y una debajo de la ...
  #1 (permalink)  
Antiguo 28/03/2010, 16:15
 
Fecha de Ingreso: octubre-2008
Ubicación: Alicante
Mensajes: 337
Antigüedad: 9 años, 1 mes
Puntos: 9
Capa simple, pero no sé como hacerlo...

Buenas, no sé que tipo de position debo ponerle a una capa, me explico.

Tengo 3 capas, del mismo ancho, y una debajo de la otra.
La primera está fija con unas medidas fijas, la segunda va a tener siempre un top y un left fijos debajo de la primera, y su alto dependera del texto que lleve. Pero la tercera, quiero que esté siempre justo debajo sin importar el alto de la segunda. (la segunda capa tendrá un alto u otro dependiendo del contenido que tenga).

Por lo tanto, no sé cómo poner que la tercera capa (la de abajo del todo) esté siempre justo pegada debajo de la segunda.

Espero haberme explicado decentemente, gracias.
  #2 (permalink)  
Antiguo 28/03/2010, 22:34
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.728
Antigüedad: 8 años, 6 meses
Puntos: 1512
Respuesta: Capa simple, pero no sé como hacerlo...

Mejor enseña lo que haz hecho, para que te puedan indicar.
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #3 (permalink)  
Antiguo 29/03/2010, 08:14
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: Capa simple, pero no sé como hacerlo...

Buenas, seria algo parecido a esto

Código CSS:
Ver original
  1. * {margin: 0; padding:0; outline:0;}
  2.  
  3. body {font-size:0.7em;}
  4.  
  5. #contenedor {margin: 4.1em auto;
  6.              width: 16em;}
  7.  
  8. #capa1 {height: 4.5em;
  9.         background-color: #f00;
  10.         padding:0.2em;}
  11.  
  12. #capa2 {background-color: #0f0;
  13.         padding:0.4em;}
  14.  
  15. #capa3 {background-color: #00f;
  16.         padding:0.2em;}

Código HTML:
Ver original
  1. <div id="contenedor">
  2.     <div id="capa1">Esta es la capa 1, y es fija</div>
  3.     <div id="capa2">Esta es la capa 2 y se ajusta al texto Esta es la capa 2 y se ajusta al texto
  4.                     Esta es la capa 2 y se ajusta al texto Esta es la capa 2 y se ajusta al texto
  5.                     Esta es la capa 2 y se ajusta al texto Esta es la capa 2 y se ajusta al texto
  6.                     Esta es la capa 2 y se ajusta al texto Esta es la capa 2 y se ajusta al texto </div>
  7.     <div id="capa3">Esta es la capa 3, pegada a la capa 2</div>
  8. </div>

Saludos¡¡
__________________
Revisa las FAQ's antes de disparar.

Etiquetas: simple, capas
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 17:48.