Expand Div with Floats

February 10, 2016 — Leave a comment

Problem

How do you expand a div to contain floats?
Elements like div’s grow to fit its contents, but when you use the float property on its children, the div will not expand.
The div will show a height of 0.

Solution to Contain a Float

Set the parent to overflow:auto.

<div style="overflow: auto;">
    <div style="float: left;">Div 1</div>
    <div style="float: left;">Div 2</div>        
</div>

Mike

Posts Twitter Facebook

My name is Michael Le, and I am a web developer.

No Comments

Be the first to start the conversation.

Leave a Reply