O que a regra CSS "claro: ambos" faz?

O Que Faz a seguinte regra do CSS: .clear { clear: both; } E porque precisamos de usá-lo?

desenhar a disposição flexível das páginas

Primeiro veja a imagem preparada com tinta. Eu quero projetar uma página flexível que terá este tipo de quatro divi ... ight { position:relative; height: 50%; width: 50%; border: 1px solid black; float: right; }