HTML: elemento de bloque de anclaje dentro de la parte inferior del bloque principal

Question

¿Hay un método de navegador cruzado para adjuntar algún contenido en un <div> en la parte inferior? Una dificultad es que el <div> puede tener una altura arbitraria aplicada, pero quiero que cierto contenido se pegue en la parte inferior en todo momento.

Esto habría sido logrado en los malos días como este:

<table style="height: foo;"> 
    <tr><td valign="top">content</td></tr> 
    <tr><td valign="bottom">stuck to the bottom</td></tr> 
</table> 

¿Puedo hacer esto sin tener que recurrir a esta técnica?

Answer 1

Claro, es bastante fácil. Simplemente configure el padre div con position:relative. Luego, el elemento interno que desea pegar en la parte inferior, simplemente use position:absolute para pegarlo en la parte inferior del artículo.

<div id="parent"> 
    <div id="child"> 
    </div> 
</div> 

.

#parent { 
    position:relative; 
} 
#child { 
    position:absolute; 
    bottom:0; 
}