Есть идеи, как реализовать данный элемент на сайте через HTML и CSS?

Тренируюсь верстать макеты. Тут столкнулся с проблемой верстки данного элемента. Можете показать пример кода 5a8ec10f63140040102889.png
  • Вопрос задан
  • 1171 просмотр
Пригласить эксперта
Ответы на вопрос 8
delphinpro
@delphinpro Куратор тега Вёрстка
frontend developer
Самое сложное было придумать селектор для блока ))
https://codepen.io/delphinpro/pen/xYJxgN?editors=1100
Ответ написан
Могу посоветовать использовать в таком случае старый добрый Bootstrap. Там можно использовать container-fluid с бэкграундом такой картинки, и 2 row с колонками. попробуй использовать 24х колончатую версию будет легче позиционировать согласно макету.
Ответ написан
Комментировать
tema_sun
@tema_sun
Задача нифига не тривиальная и с наскока не решилась. В итоге зашел в тупик https://jsfiddle.net/j3znd5hq/ , надо делать заново и по-другому, но это уже лень. По крайней мере посмотрите как не надо делать.
Ответ написан
Комментировать
@makkeymr
dev-ithard.com там ниже есть похожий блок. Гляньте, возможно вам поможет
Ответ написан
Комментировать
zooks
@zooks
Frontend
Маркированный список ul li и flex.
Ответ написан
Комментировать
Пример на флексбокс и transform: translate
Самое ленивое решение.
Ответ написан
Комментировать
stasigg
@stasigg
Junior Frontend
Чуть поправил вариант Basil_Dev. Без transform.

Ссылка
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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