Float container height (clearing)
It seems to have been a common problem to force containers to be at least as tall as floated elements that are contained in it. Alex Walker wrote an excellent article about some solutions as well as about very simple one.
The simple solution is to give overflow:auto; (or none) to the container. It seems to work in most browsers I have tested. NOTE: This seems to be related to the so-called block formatting contexts, which are explained here by Matt Ryall. The very same technique allows repairing blocks adjacent to floated elements.
I less elegant solution is to insert <br style="clear:all" /> just before the closing tag of the container. This, however, pollutes the markup.
Another solution seems to be to float the container as well.
I hope this post will make it easier to find this excellent article for whomever might need it.
The simple solution is to give overflow:auto; (or none) to the container. It seems to work in most browsers I have tested. NOTE: This seems to be related to the so-called block formatting contexts, which are explained here by Matt Ryall. The very same technique allows repairing blocks adjacent to floated elements.
I less elegant solution is to insert <br style="clear:all" /> just before the closing tag of the container. This, however, pollutes the markup.
Another solution seems to be to float the container as well.
I hope this post will make it easier to find this excellent article for whomever might need it.