HTML: élément de bloc d'ancrage à l'intérieur du bas du bloc parent?

Question

Existe-t-il une méthode multi-navigateur pour attacher du contenu dans un <div> au fond? Une difficulté est que le <div> peut avoir une hauteur arbitraire appliquée, mais je veux que certains contenus soient collés au fond de celui-ci à tout moment.

Cela aurait été accompli dans les mauvais jours comme celui-ci:

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

Puis-je le faire sans avoir recours à cette technique?

Answer 1

Bien sûr, c'est plutôt facile. Définissez simplement le parent div avec position:relative. Ensuite, l'élément interne que vous souhaitez coller au fond, utilisez simplement position:absolute pour le coller au bas de l'élément.

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

.

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