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

Привет! Верстаю сайт резина + медиа и возник вопрос по реализации данного блока www.imageup.ru/img110/2999963/jjguyeshshht.jpg
Собственно, нужно чтобы картинка была резиновая а контент можно было поправить минимальным количеством медиа.
У меня 2 варианта:
1) Поставить картинку на фон блоку и задать background-size 100% и блок будет формировать высоту за счет содержимого ИЛИ
2)Картинку поместить в html и блоку с контентом задать position absolute?
Подскажите есть еще какие то варианты, и как из них самый правильный?
  • Вопрос задан
  • 202 просмотра
Пригласить эксперта
Ответы на вопрос 3
aloky
@aloky
js
<div class="container">
  <div class="row justify-content-between">
    <div class="col-md-auto"></div>
    <div class="col-md-auto"></div>
    <div class="col-md-auto"></div>
  </div>
</div>
Ответ написан
Комментировать
Hardjuice
@Hardjuice
Верстальщик
Картинку задать фоном с помощью background-size:cover;
Блоки при уменьшении разрешения экрана сделать в столбик. Получится 3 строки. При таком варианте получается минимум кода в media-запросе.
Ответ написан
Комментировать
AskMy
@AskMy
иногда решаю задачки и задаю глупые вопросы
https://codepen.io/topicstarter/pen/QQVBNG так вроде бы , только не забываем вставить тег viewportи поменяете иконки на свои ...
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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