Как выровнять текст по вертикали в разных блоках?

Question

[Иван]

Как выровнять все элементы по оранжевой линии с обеих сторон и как это называется?

Answer 1

[Рома Зварич]

Для родительского элемента задаётся внутренний отступ (padding) с нужной стороны и все помещаемые внутрь него элементы размещаются после этого отступа.

Comments

[Иван]

Padding и фон задевает.
Стоит ли весь блок завернуть в отдельный div только для фона?

[Рома Зварич]

Иван, в этом вроде не должно быть необходимости.

Со слов сложновато понять, о чем речь.

Вы не могли бы пример кода выложить например, в https://codepen.io/

[Иван]

В данном случае текст расположение ровно вместе с черным фоном, но мне нужно, чтобы черный фон был на всю ширину экрана

[Рома Зварич]

Есть разные варианты решения.

Например, для обоих блоков задайте класс, в котором будет указан отступ
А для блока с чёрным фоном добавьте ещё один класс, в котором будут другие цвета.

Результат:
https://codepen.io/hisbvdis/pen/PoWLPeM

[Иван]

Рома Зварич, Спасибо большое!

Answer 2

[Алексей Сироткин]

У блоков и у содержимого могут быть различные padding, margin, border и т.д. - если это все убрать или привести к нужным значениям, то получится ровненько. А шрифты могут на несколько пикселей вправо смещаться, это такая особенность.

Comments

[Иван]

Мне нужно не просто ровно, а с конкретным расстоянием от края экрана