Grokking CSS for Web Development
Vote

0% completed

​

Clearing floats

What happens to a heading that comes right after a short paragraph beside a floated photo? It does not start below the photo. The heading is a block box in normal flow, so it starts right after the paragraph, and its text is placed beside the photo like any other line. Floats cause two problems of this kind, and this lesson fixes both: content that should start below a float, and a container that should grow to include its floats.

The running example

Here is the product article from the previous lesson with a shorter introduction and a "Specifications" heading

.....

.....

.....

Like the course? Get enrolled and start learning!

Reading Progress

0%


Vote for new content