Dónal Dónal - 22 days ago 6
CSS Question

HTML/CSS positioning "float: bottom"

Given the following HTML:



<div id="container">
<!-- Other elements here -->
<div id="copyright">
Copyright Foo web designs
</div>
</div>





I would like
#copyright
to stick to the bottom of
#container
.

Can I achieve this without using absolute positioning? If the float property supported a value of 'bottom' it seems that would do the trick, but unfortunately, it doesn't.

Answer

Likely not.

Assign position:relative to #container, and then position:absolute; bottom:0; to #copyright.


#container {
    position: relative;
}
#copyright {
    position: absolute;
    bottom: 0;
}