@lodas

Как верстать пиксель перфект на bootstrap?

Предположим в макете есть моменты которые не вписываются по сетке бутстрапа на 12 колонок, например:
1) Левый блок col по ширине может быть равен 2.5(два с половиной стандартных столбца) или 3.7(стандартных столбца) - правый блок 7.8(стандартных столбца).
2) Точка медиа-запроса если блок не стандартный тоже будет другой.
3) Ширина основного container не бутсраповская к примеру 1750px.
4) Как вообще верстаются сайты не нарисованные под сетку bootstrap по pixel perfect. Как вариант можно предположить, что местами перекрываются стили фреймвока или есть другие решения.

Все значения взяты для примера. Как наиболее правильно обрабатывать такие моменты?
  • Вопрос задан
  • 1200 просмотров
Решения вопроса 2
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Левый блок col по ширине может быть равен 2.5(два с половиной стандартных столбца)

И что здесь не вписывается?

.col {
  @include make-col-ready();
  @include make-col(2.5);
}


аналогично популярная тема с пятью столбиками

.col-1-of-5 {
  @include make-col-ready();
  @include make-col(1, 5);
}


Bootstrap — это не только ценный мех скаченный bootstrap.min.css, это еще и куча полезных миксинов.

сайты не нарисованные под сетку bootstrap

нет «сетки bootstrap», есть «сетка в бутстрапе». И с этой сеткой можно творить всё что угодно.
Отсюда вывод: если дизайн нарисован по сетке (неважно как), то его можно сверстать в том числе и с помощью сетки из состава бутстрапа.
Ответ написан
alex-1917
@alex-1917
Если ответ помог, отметь решением
Полуторные и прочие колонки реализуются на раз-два-три, наверху правильно подсказали. Другое дело, что может понадобиться и например, 2,125))) Тогда только выбрасывать бутстрап, так как придется добавлять еще по пачке стилевых условия для каждого медиа-запроса!
На практике использую бутсnрап - для 12-grid-макетов и еще пару, не буду озвучивать, выбери сам, вобщем 14-grid есть и себе наляпал 24-grid!!)) покрывает 90% приходящих макетов...
По сути сама сетка - это 40 строчек css, все остальное уже от лукавого, таже не забывать, что в бутстрапе миллион встроенных штучек - слайдеры, табы и т.д. лучше грузануть один bs.js, чем ляпать на каждый эффект по библиотеке.
А вообще рисовальщик (сиречь дизайнер), который не может уложиться в 24-grid - крайне паршив! Если вписывается в 12-grid - рисовака идеален!!))
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
1) не использовать col бутстрапа и сделать свои колонки?
2) ну тк ставь свои точки
3) тут кастомизируется все, что пожелаешь getbootstrap.com/docs/3.3/customize
4) см. п. 1
Ответ написан
Комментировать
dom1n1k
@dom1n1k
Вопрос звучит примерно следующим образом - "как лучше и удобнее надевать штаны через голову?"
Ответ - "не надо надевать штаны через голову".
Не надо использовать Бутстрап там, где логика макета противоречит его конструкции.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы