Выполнить

Задание 1. Добавьте изображениям классы. В классах укажите свойство float:left. Изучите как изменится вывод страницы.

See the Pen float zadanie by Alex (@Asmodey) on CodePen.

Выровняйте изображения поочередно по левому и по правому краю.

Задание 2. Используя свойство float сделайте три блока идущие в один ряд (три колонки).

See the Pen zadanie float by Alex (@Asmodey) on CodePen.

Обратите внимание, что при выстраивании блоков в ряд, родительский элемент «схлопывается». Предотвратите «схлопывание» используя clear:both.

Задание 3. На основе предыдущего примера постройте сетку блоков:

See the Pen XbqGbp by Alex (@Asmodey) on CodePen.

Задание 4. Выполните верстку сайта состоящую из блочных элементов: