@lolrofl01

Как в бутстрапе сделать контейнер в контейнере или такой отступ?

Смотрю макет, а там почему-то не 12, а 14 колонок. Скрин тут: prntscr.com/kyxrbf . Сам сайт имеет boxed вид, т.е. не на всю ширину, а лежит в контейнере. Его я на скрине выделил красным. Далее с обеих сторон желтым я выделил те самые отступы, которые не знаю как реализовать. Они равны ширине одной колонки, но вместе с ними получается не 12, а 14 колонок. Значит это не колонки, а лишь отступы равные колонкам. Вот как сделать такой отступ? Контейнер в контейнере отказывается работать, а какой-нибудь маргин или паддинг не уверен, что получится такого же размера как и ширина 1 колонки. Как вообще делаются такие отступы и правильно ли сделал дизайнер?
  • Вопрос задан
  • 160 просмотров
Решения вопроса 1
@Sly04
Самое простое - это сделать 14 колонок и следовать макету, нежели выдумывать различные отступы.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
@qviktor
Дружище, была похожая ситуация.
Не стал долго разбираться, сделал контейнер в контейнере. Первый контейнер был флюидом с фоном, а во втором контент. Количество колонок - тоже не проблема, мне часто прилетают заказы с 16-18-20 колонками.

На сайте бутстрапа есть компилятор, там можно вбить количество колонок и сохранить перекомпилированный бутстрап
Ответ написан
Комментировать
delphinpro
@delphinpro Куратор тега Вёрстка
frontend developer
Не в ту сторону смотрите скорее всего.
Во-первых, эти отступы актуальны только на больших экранах
Во-вторых, вряд ли принципиально то, что они равны ширине колонки.

Просто сделайте свой кастомный контейнер с фиксированными паддингами, пикселей 70-80.

.my-container {
  max-width: 1300px;
  margin: auto;

  @include media-breakpoint-up(xl){
    padding: 0 80px;
  }
}
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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