CSS3 даёт нам прекрасный и лёгкий инструмент для создания резиновых колонок с текстом.
Колонки – создание средствами CSS3
.two-column {
column-count: 2;
column-gap: 20px;
}
.three-column {
column-count: 3;
column-gap: 20px;
}
Этот код создает красивые 2 и 3 колонки равной ширины с расстоянием между ними равным 20px. Такой код будут писать наши дети, так как IE9, не имеет поддержки “CSS Multi-column layout”.
Что делать?
Будем искать рабочее решение. Требуется:
- любое количество резиновых колонок с фиксированным расстоянием между ними
- поддержка IE6 и выше
- отсутствие JS
- различные ширины колонок