Как сверстать такой блок (возможно bootstrap cards)?

Question

[Юлия]

Подскажите, пожалуйста, как сверстать такие кликабельные блоки? Сверстала просто колонками, но мне кажется, можно взять bootstrap cards, они как раз по формату подходят.
Но я совсем не понимаю, как сделать бэкграунд двух цветов, да чтоб серый еще растянулся на всю ширину контейнера, а не только на ширину колонки!
Заранее спасибо за помощь!

Comments

[Модератор]

Для комментирования ответа жмите линк "Комментировать" под ответом
Не нужно писать комментарий в форме для ответа
Оповещения о такой реплике не поступит автору ответа

Не нужно засорять секцию ответов "спасибовсем", "решено" и тп

Answer 1

[Михаил]

Мой комплиман дизайнеру (нет)

Вроде того
https://css-tricks.com/full-width-containers-limit...

https://jsbin.com/quteyakevu/edit?css,output

Answer 2

[Ankhena]

Примерно так: https://jsfiddle.net/w95gy0uh/
Поскольку, высота фото одинакова и известна, то градиентом.
https://html5book.ru/css3-gradient/