# 019: Создание простой сетки - CSS-хитрости

Anonim

Дизайн сайта очень похож на сетку. Наши модули будут очень аккуратно выложены в сетку. Но разве сетки не сложны и не странны? И, может быть, нам стоит использовать какой-нибудь модный фреймворк? Неа. Они легкие. Мы создадим простой за несколько минут. Используемые здесь концепции вдохновили статью «Не переусердствуйте с сетками ИТ».

Конечно, мы сталкиваемся с некоторыми проблемами по пути (как и вы). В этом случае мы использовали селектор атрибутов, который не соответствовал нашим требованиям.

Мы также создали CSS-файл «инструментария», который будет содержать универсальные, многоразовые и полезные в глобальном масштабе классы. Первым, как всегда, является Clearfix - немного CSS, который мы можем использовать для родительских элементов, которые мы не хотим разрушать из-за их плавающих дочерних элементов. Мы не загружаем CSS этой панели инструментов как отдельный файл, мы @import'ем его в глобальный.

Мы добились того, чтобы сетка заработала, но нам еще нужно поработать, чтобы правильно установить модули и установить желоба.