Foros del Web » Creando para Internet » CSS »

alineacion vertical dentro de un div

Estas en el tema de alineacion vertical dentro de un div en el foro de CSS en Foros del Web. tengo un div de 300 pixeles de altura y anchura, y quiero que dentro de este div se encuentre otro div de 20 pixles de ...
  #1 (permalink)  
Antiguo 11/10/2005, 10:17
 
Fecha de Ingreso: julio-2003
Mensajes: 437
Antigüedad: 14 años, 4 meses
Puntos: 0
alineacion vertical dentro de un div

tengo un div de 300 pixeles de altura y anchura, y quiero que dentro de este div se encuentre otro div de 20 pixles de alto y 300 de ancho, y quiero que se halle justamente en la parte inferior del primer div.

he probado con valign en bottom y no lo reconoce, y la unica forma que encuentro de hacerlo es con un padding.

pero no hay ningun atributo que indique que un div se alinee dentro de otro div (arriba. medio o bajo, como sí funciona de forma horizontal)???
  #2 (permalink)  
Antiguo 11/10/2005, 10:27
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola chusete

Prueba de esta forma:
Código:
<div style="width:300px; height:300px; position:absolute">
<div style="width:300px; height:20px; position:absolute; bottom:0;">
</div>
</div>
Saludos,
  #3 (permalink)  
Antiguo 13/10/2005, 02:45
 
Fecha de Ingreso: julio-2003
Mensajes: 437
Antigüedad: 14 años, 4 meses
Puntos: 0
perfecto, pero ahora lo que no consigo es alinearlo en la mitad del div,
como se hace eso??
  #4 (permalink)  
Antiguo 18/10/2005, 02:36
Avatar de axiertxo  
Fecha de Ingreso: octubre-2005
Ubicación: España
Mensajes: 387
Antigüedad: 12 años, 1 mes
Puntos: 0
<div style="width:300px; height:300px; position:absolute">
<div style="width:300px; height:20px; position:absolute; bottom:0;Align:center;">
</div>
</div>
  #5 (permalink)  
Antiguo 18/10/2005, 04:05
 
Fecha de Ingreso: julio-2003
Mensajes: 437
Antigüedad: 14 años, 4 meses
Puntos: 0
con lo que has puesto lo alinero horizontalmente, pero yo lo que busco es la alineacion vertical, que esté en el medio verticalmente
  #6 (permalink)  
Antiguo 18/10/2005, 04:29
Avatar de axiertxo  
Fecha de Ingreso: octubre-2005
Ubicación: España
Mensajes: 387
Antigüedad: 12 años, 1 mes
Puntos: 0
VALE pos lo que te falta es con un poco de matematica:

<div style="width:300px; height:300px; position:absolute">
<div style="width:300px; height:20px; position:absolute; bottom:0;Align:center;">
</div>
</div>

si el div contenedor mide 300 de ancho y 300 de alto y el del interior mide 300 de ancho y 20 de alto, di le das un margen de 140 pixels arriba y de 140 pixel abajo al div del interior, conseguimos que el div del interior siempre esté en el medio.
140 de margen superior mas 20 de alto mas 140 de margen inferior 300px

tonces quedaria algo asi
<div style="width:300px; height:300px; position:absolute">
<div style="width:300px; height:20px; position:absolute bottom:0;Align:center;padding-top:140px;margin-top:140px;padding-bottom:140px;margin-bottom:140px;">
</div>
</div>
Hay que observar que pongo margin-top y su respectivo padding-top por compatibilidad en distinto navegadores. ah! por cierto los position:absolute no te harían falta

Saludos
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 19:30.