|
|
Posted by JL on 09/13/07 08:40
Hi
Suppose I have a footer div with a background colour and, in the footer,
I'd like to have some links on the left and a copyright notice on the
right. I'd do something like this:
#footer {
color: #FFF;
background-color: #000;
padding: 4px 10px;
}
<div id="footer">
<div style="float: left">
<a href="#">Privacy Policy</a> | <a href="#">Site Map</a>
</div>
<div style="float: right">
Copyright © 2007 MyComp
</div>
</div>
However, if I do this, the black background of the footer div
disappears. I know this is because the floated contents do not prop up
the footer container.
The only workarounds I know are to give #footer a height, which ruins
things when fonts are resized, or putting an element inside the footer,
after the other two div's, that is clear:both; but neither option is
satisfactory.
Am I missing something here? What do you guys do?
[Back to original message]
|