# 053: Адаптивные колонки для галереи - CSS-хитрости

Содержание

Мы добавляем некоторую отзывчивость к сетке, которую мы создали для Галереи. На самых широких экранах у нас установлено четыре столбца. Затем мы начинаем добавлять точки останова с помощью наших супер простых @mixins, которые мы настроили и постоянно использовали повторно.

В нашей точке останова мама-медведь мы опускаемся до 3 столбцов, затем мы делаем промежуточную точку останова между мамой-медведем и медвежонком, где он разбивается на 2 столбца, а затем в конечном итоге 1 столбец у медведя. Это очень просто, так как все, что нам нужно сделать, это настроить количество столбцов, которые мы устанавливаем с помощью CSS3 column-count.

Мы заканчиваем видео рассказом о будущих целях галереи. Было бы неплохо иметь возможность загружать разное количество изображений на разные размеры экрана и использовать фактические эскизы вместо полноразмерных изображений. Возможно, однажды мы туда доберемся.

Для записи, программное обеспечение, которое я использую локально для создания снимков экрана и загрузки их на сервер через FTP, называется LittleSnapper.

Интересные статьи...