Робота з відступами padding на CSS

Ми з вами розібрали властивість margin, що робить відступ назовні від кордону. Існує також дуже схожа властивість padding, яка робить відступ усередину від кордону.

Давайте тепер подивимося на прикладах, як працює ця властивість. Для початку наведу блок без відступів (у нього текст прилип до кордонів):

<div id="elem"> якийсь текст... </div> #elem { width: 300px; border: 1px solid red; text-align: justify; }

:

А тепер задамо padding в 30px для всіх сторін:

<div id="elem"> якийсь текст... </div> #elem { padding: 30px; width: 300px; border: 1px solid red; text-align: justify; }

:

Повторіть сторінку за цим зразком:

Повторіть сторінку за цим зразком: