The clearfix hack

Here is a weird, bad thing that can sometimes happen when using floats:

img{
float: right;
}

There is a way to fix this, but it’s ugly. It’s called the clearfix hack.

Let’s try adding this new CSS:

Now let’s see what happens:

This works for modern browsers. If you want to support IE6 you will want to add the following: