What are the various clearing techniques and which is appropriate for what context?

• Empty div method: <div style="clear:both;"></div>.
• Clearfix method: Refer to the .clearfix class above.
• overflow: auto or overflow: hidden method: Parent will establish a new block formatting context and expand to contains its floated children.

In large projects, having a utility .clearfix class will be very helpful. overflow: hidden might clip children if the children is taller than the parent and is not very ideal.

References

• Front End Interview Handbook