Padding: 20px, Height: 5px как сделать высоту 5px если есть отступ?

Question

[Dubrovin]

box-sizing: border-box;
height: 5px;
max-height: 5px;
padding: 20px;

Высота блока 40px, хотя значение height и max-height установлено в 5px. Что добавить, чтобы высота была 5px несмотря на присутствие отступа?

Comments

[Сергей delphinpro]

Разберитесь для начала с блочной моделью. Какие метрики есть у элементов и для чего они...

[Dubrovin]

Сергей delphinpro, по-моему вопрос вполне конкретный, если не знаете решения - проходите мимо

[Сергей delphinpro]

Dubrovin, не грубите.

Представьте коробку с внутренней обивкой. Толщина обивки 20 см. А вы хотите сделать чтобы вся ширина коробки не превышала 5 см. Возможно это?

Answer 1

[BigSmoke]

Ну, заменить padding на margin наверное.

Comments

[Dubrovin]

Вопрос вполне конкретный, я правильно использую отступ, нужен именно padding, а не margin.

[Dubrovin]

Иллюстрация: prntscr.com/j3gl3y

[BigSmoke]

Dubrovin, значит переделывайте html верстку вашего аккордиона. Потому что padding в любом случае увеличит общий размер блока.

Answer 2

[Fl_SparkyBooMan]

Padding - это внутренний отступ блока, а margin - это внешний отступ блока! В вашем случае надо padding заменить на margin, т.е. вы просто внутренний отступ меняете на внешний))

Comments

[Dubrovin]

Читайте комментарий выше, вопрос как сделать высоту блока независимой именно от padding.