Как выровнить картинку при помощи flex?

Question

[SkySeven]

Как выровнить картинки по центру как на макете?

Comments

[tema_sun]

Код ваш где?

[Ден Тоцкий]

у тебя сетка на макете завалена вправо

[lamer350]

Ден Тоцкий, Это даже сеткой сложно назвать)

[freeman0204]

Создай этот блок(текст с картинкой), можно на flex, и скопируй его еще 2 раза, задай этим троим родителя, с relative, а им дай абсолют, выровняй эти блоки по центру, в зависимости от ситуации, right: calc( 50% - половина круга) и transform: translate(-50%, 0); Все нужно ровнять по центру, потому что текстa быть разное количество. Может можно и без absolute, я не проверял. Это как идея.

Answer 1

[Дмитрий]

1. 3 родителя div, и CSS Background
2. 1 родитель и три дочки, с подвязкой псведоэлементов before & after
3. Фон без текста вырежать, через CSS Background ставь 1 родителю, дальше 3-х дочек по флексу выровнять (можно даже float тут использовать, по-старинке).

Можно классически "зафлотить" все, можно гридами разложить, как фанатазия или ТЗ подсказывает.

Answer 2

[freeman0204]

На скорую руку, но думаю суть ясна.
На адаптиве съезжает, но думаю там медиа запросами просто уже доделать, на телефоне такая расстановка блоков не нужна.