Праца з водступамі padding у CSS

Мы з вамі разглялі ўласцівасць margin, якое робіць водступ вонкі ад мяжы. Існуе таксама вельмі падобная ўласцівасць padding, якое робіць водступ унутр ад мяжы.

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

html<div id="elem">
  some long text
</div>

css#elem {
  width: 300px;
  border: 1px solid red;
  text-align: justify;
}

Результат:

А зараз зададзім padding у 30px для ўсіх бакоў:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 30px;
  width: 300px;
  border: 1px solid red;
  text-align: justify;
}

Результат: