Когда дело касается строковых элементов, между полями и отступами существует одно основное отличие. Для иллюстрации давайте начнем с отступов слева и справа. Здесь, если задать значения для отступа справа или слева, они будут видимыми:

strong {padding-left: 10px; padding-right: 10px; background: silver;}

Обратите внимание на дополнительное пространство, появляющееся на одном из концов строкового незамещаемого элемента. Это и есть ваш отступ. Как и в случае с полями, отступ слева применяется к началу элемента, а отступ справа – к концу: однако отступ не применяется с правой или с левой стороны в каждой строке. Это же справедливо и для замещаемых элементов, хотя, конечно, такие элементы не переносятся со строки на строку. Теоретически строковый незамещаемый элемент с заданным цветом фона и отступом мог бы иметь фон, распространяющийся выше и ниже элемента:

strong {padding-top: 0.5em; background-color: silver;}

Конечно, высота строки не меняется, но поскольку отступы растягивают фон, он должен быть видимым, правильно? Правильно. Он видимый и перекрывает предыдущие строки – таков ожидаемый результат.

Добавлено: 18 Июля 2018 21:01:10 Добавил: Андрей Ковальчук Нравится 0

Добавить