A padding margók kezelése CSS-ben

Már megvizsgáltuk a margin tulajdonságot, amely a szélektől kifelé hoz létre margót. Létezik egy nagyon hasonló tulajdonság, a padding, amely a szélektől befelé hoz létre margót.

Nézzük most példákon keresztül, hogyan működik ez a tulajdonság. Először mutatok egy blokkot margók nélkül (a szövege a szélekhez tapad):

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

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

Результат:

És most állítsuk be a padding értékét 30px-ra minden oldalra:

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

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

Результат: