You can pretty much use overflow: hidden
all the time.
But, there are exceptions. Here’s an example of one:
Overflowing a container div horizontally but not vertically
The question there was:
- There’s a fixed height on this: http://jsfiddle.net/je8aS/2/
- Without the fixed height: http://jsfiddle.net/thirtydot/je8aS/5/
- How to clear the floats without using a fixed height?
overflow: hidden
doesn’t work: http://jsfiddle.net/thirtydot/je8aS/6/- You have to use some other method of clearing floats, such as
clear: both
:
http://jsfiddle.net/je8aS/3/ - The clearfix class also works: http://jsfiddle.net/thirtydot/je8aS/11/
Here’s a more important example of when you can’t use overflow: hidden
:
http://fordinteractive.com/misc/overflow/
That’s not to say that clearfix is the only alternative – display: inline-block
cleanly fixes that example:
http://jsbin.com/ubapog