What are the various techniques for clearing floats?

0

Floats are still incredibly common. As this is published, still probably the most cross-browser consistent way to build layout and grids. Anyone who has worked with them is aware of float collapsing. That is, floated element do not add to the height of a parent element. So for example if a parent element contained only floated elements, it would collapse to zero height. You can deal with that like:
Use a clearfix (bonus points for micro clearfix).
Float the parent as well.
Use an overflow property other than β€œvisible” on the parent (bonus points for listing downsides like cutting off shadows).
As a bonus question, you could ask them to compare using inline-block and floats for building a grid. Good answer: there are problems either way. With inline-block you need to deal with the whitespace issue. With floats you need to deal with clearing.

Css
asked Apr 14, 2023 at 18:27
Sign in to add a comment

0 Answers

0
πŸ“ No answers yet!

Be the first to answer this interview question.

Your Answer

Sign in to post your answer and help the community.