@LolExtasy

Как так сверстать?

bxgazkyegcuswe5mobe9pcdgnyg.png
Как можно адаптивно сверстать такие секции, где одна сторона выходит за контейнер, а другая его соблюдает, чтобы было адаптивно
  • Вопрос задан
  • 814 просмотров
Решения вопроса 3
@bqio
https://github.com/bqio
Не понял, что Вы имели ввиду. Верстка на изображении выше может выглядеть вот так:

<div class="grid">
  <div>content</div>
  <div><img /></div>
  <div><img /></div>
  <div>content</div>
</div>

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}
Ответ написан
AntonLitvinenko
@AntonLitvinenko
HTML coder
Я конкретно тут вообще не вижу проблемы.
1. картинка бекграундом, поверх нее в сетке текст, который занимает 4 колонки
2. Картинка абсолютом, поверх нее блок с все той же сеткой, 4 колонки которой занимает текст
серое - бекграунд под картинкой или одновременно с ней
Ответ написан
@chingiz21
Через display: flex, затем задать свойство wrap. Ну и по мелочи натянуть картинки, оформить текст.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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