Make The Height of a Parent Div Wrap Around The Children with Float

Using floating divs is great, but can cause lots of other issues sometimes. One particular one is getting the height of a parent div to wrap around its children if the children have the float attribute.

There are several ways to do this mentioned in this Stack Overflow post, but here is the one that worked for me:

Use the :after psuedoelement on the parent div with the following CSS:

.parent:after {
  content: "";
  display: table;
  clear: both;	
}
Advertisements

One thought on “Make The Height of a Parent Div Wrap Around The Children with Float

  1. Pingback: Make The Height of a Parent Div Wrap Around The Children with Float | How I Learned Ruby on Rails

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s