CSS Floats

From the book: Floats, page 96

Floats are perhaps one of the most important CSS rules, as they allow you to stack content horizontally as well as vertically. Generally, HTML by default stacks content downwards and, without the float rules, it was very difficult to get content to sit side-by-side.

No floats applied 
Both objects migrate to the left of the page, stacking from the top-down. 
Floats applied, option 1
Soups floated left, and milkshakes floated right.
Floats applied, option 2
When both (or multiple) objects are floated left, they stack side by side.