Как сделать таб чтоб width:100% уменшалась в зависимости от margin?

Question

[emmawasms]

Здраствуйте, как известно, при неизменной width:100% с увеличением padding абсолютная длина будет уменшатся. Однако как получить тотже еффект с использованием margin? Чтоб блок не выплывал за предели родителя а просто уменшался в длинне

Comments

[Ankhena]

Самый простой способ это не писать width 100%.

Поможет он вам или нет зависит от того что еще есть в коде.

[Максим Иванов]

Кода не вижу - напишу то, что думаю...
Фикс. ширину родителю

Answer 1

[strelok011]

Если у Вас не флекс-верстка, то:
1. С увеличением padding абсолютная длина будет что??
2. Тот же эффект - это какой?

Если у Вас есть блочный контейнер (div, p, h, которые по умолчанию имеют состояние display: block), то они занимают всю доступную ширину, им указывать 100% не обязательно.
Если Вы хотите зафиксировать ширину блока и добавить ему паддинг, то для сохранения значения ширины добавляют атрибут box-sizing: border-box, т.к. значение по умолчанию content-box
Если вы хотите задействовать margin - можно использовать вычисляемую ширину
width: calc(100% - 20px)
где margin в сумме должен быть равен 20px. При этом обязательна именно такая расстановка пробелов. Внутри скобок между значениями и арифметическим знаком.

Чтобы меньше путаться - гуглите информацию про блочные и строчные элементы.