Быстрые сетки для верстальщиков

Скрипты и советы | 30 июля 2017 2 916

Уроки CSS на Хабрахабре, habrahabr.ru, Разработка веб-сайтов

Любому верстальщику, перед которым встала очередная задача по вёрстке адаптивного макета, нужны сетки. В большинстве случаев берётся старый добрый bootstrap, и в html-ке начинают появляться div-ы с классами вида col-xs-6 col-sm-4 col-md-3. И вроде бы всё хорошо и быстро, но в данном подходе часто возникает множество подводных камней. В данной статье мы рассмотрим эти подводные камни, и закидаем тухлыми помидорами рассмотрим мою поделку для беспроблемных сеток.

Читать дальше →
[Из песочницы] Типичная ошибка сетки (Bootstrap Grid), или почему дизайнер и верстальщик не понимают друг друга

Сталкивались ли вы с ситуацией, когда текст и блоки, которые прекрасно вмещаются в макете фотошопа, почему-то упрямо не...

Подробнее
[Из песочницы] Все об SVG анимации

В данной статье я хочу осветить тонкости работы с SVG-графикой, SVG анимация (в том числе и path), проблемы и способы...

Подробнее
Делаем отзывчивый и максимально возможный размер шрифта динамического текста относительно контейнера

Перед нами часто возникает задача, сделать текст отзывчивым в зависимости от размера экрана устройства. Казалось бы,...

Подробнее
Как быстро создать Bootstrap-сайт для бизнеса: 6 полезных инструментов

Как быстро создать Bootstrap-сайт для бизнеса: 6 полезных инструментов // Все публикации подряд...

Подробнее
Обзор синтаксиса Tailwind CSS

Салют, Хабр! Tailwind CSS – это utility-first CSS фреймворк, который отличается от традиционных CSS фреймворков вроде...

Подробнее
Введение в SVG-анимации для верстальщиков

Время идет, технологии меняются, набитые шишки копятся, настала пора обновить материалы по SVG-анимациям. Тем более,...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями