@CmrdCat
Никудышный верстальщик

Как сверстать этот блок?

Доброго времени суток всем, подскажите, как запозиционировать так объекты ? 5e72750905b1a478249911.png
Флексами справиться не смог. CodePen 5e727517d2cdc224274216.png
И как при этом задать второй строке прозрачность?
Есть ли способ сделать это всё в одном блоке или единственным вариантом будет сделать две строки и позиционировать абсолютно ?
  • Вопрос задан
  • 191 просмотр
Решения вопроса 1
sniggering_deus
@sniggering_deus
Mother is a god in the eyes of a child.
Как-то так с помощью CSS Grid:

Вариант первый:



Вариант второй:



С помощью Flexbox. Деление на две секции + отрицательный margin для последней секции:



С помощью Flexbox. Версия вторая с комментами и возможностью быстро уменьшить блоки.

Ответ написан
Пригласить эксперта
Ответы на вопрос 1
aliencash
@aliencash
Партизан
Так-то вроде не сложно на flex - https://codepen.io/aliencash/pen/eYNKQBR
Сложно когда пытаешься, чтобы адаптивно было. Но в приниципе все можно посчитать, даже на css, если помнить теорему Пифагора.
Ответ написан
Ваш ответ на вопрос

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

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