@Skaam

Как сделать такую сетку?

Добрый день!

Возникла сложность в реализацией такой сетки (на первый взгляд вроде не сложно, но хоть убей не доходит):
3 составляющие - хедер, сайдбар, контент

1) на больших экранах 2 колонки
1ая - хеадер + контент (колонка резиновая, растягивается на всю ширину окна),
2ая - сайдбар (колонка фиксированной ширины)

2) на маленьких экранах 1 колонка (резиновая на всю ширину окна)
сайдбар при этом становится между хеадером и контентом т.е.:

хедер
+
caдбар
+
контент

вот пример на bootstrap
https://codepen.io/looktoroot/pen/wqNbgL
но тут сайдбар не фиксированной ширины, а нужно фиксированной
если сделать его в примере фиксированной ширины, то появляется ненужные отступы из за бутстраповских колонок.

Есть конечно вариант с использованием position: absolute для сайдбара на больших экранах, но тогда этот блок выпадет из контекста потока, я этого хочу избежать.

Использование бутстрапа не обязательно.
  • Вопрос задан
  • 352 просмотра
Решения вопроса 1
@cssfish
Плохое знание основ - причина больших бед
погуглите как сделать две колонки, толку побольше чем от бутстрапа будет.
чтоб не пугать отрицательными маржинами, вот calc вариант
https://jsfiddle.net/zx30Luey/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
23 нояб. 2024, в 00:16
2000 руб./за проект
22 нояб. 2024, в 23:55
3000 руб./за проект
22 нояб. 2024, в 22:26
3500 руб./за проект