alexraven
@alexraven
веб-разработчик, специализация - wordpress

Как сверстать такую штуку?

Может быть, я туплю, но никак не могу придумать, как сверстать это. Сайт использует Bootstrap v4. Два блока один под другим по 400 пикселей высотой, и один 800. Картинки фоном. На ум приходит в первую очередь position: absolute, но что-то не хочется.

aac5aeb067854d93bc51c4c614476882.png

Вот мой код, но когда таких блоков например, 4 на странице, то почему-то белая граница идет "ступеньками".

https://jsfiddle.net/alex_raven/f22j9v46/#&togethe...

А сама проблема выглядит вот так:

cd476a57cffd48fea29854bfa4e6852d.jpg
  • Вопрос задан
  • 1416 просмотров
Пригласить эксперта
Ответы на вопрос 4
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
display: flex;
flex-direction: column;


Или masonry
Ответ написан
@MattLe
Ну во первых, про позиционирование absolut'ом забудьте раз и на всегда, это признак низкого скила.
Ну а во вторых, я бы делал на flexbox'ах
Ответ написан
kn1ght_t
@kn1ght_t
Ответ написан
Комментировать
alexraven
@alexraven Автор вопроса
веб-разработчик, специализация - wordpress
Я таки сверстал это - при помощи float, position: absolute там используется для позиционирования текста внутри этих блоков.

staging.spectapp.com/collections
Ответ написан
Ваш ответ на вопрос

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

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