Как в css выровнять контент вдоль одной воображаемой линии?

Question

[mpvcluuuuub]

Есть два воображаемых блока, один с текстом, другой с картинкой, как их поставить симметрично нарисованной линии? Чтобы они стояли центрами друг к другу.

Comments

[ReActor Дмитрий Вершанский]

Андрюша Гаврилов, ты ли это?!)

Answer 1

[ReActor Дмитрий Вершанский]

Здравствуйте.

Воспользуйтесь классами bootstrap-сетки ( технология flexbox ) или используйте grid.

пример с Grid:

.grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
align-items: center;
}

Примечание. html будет примерно таким::

<div class="grid">
<div class="grid-element">набор элементов слева</div>
<div class="grid-element">набор элементов справа</div>
</div>

Answer 2

[archelon]

если по центру, то для родительского элемента:

.container {
  display: flex;
  align-items: center;
}