Taandete (padding) kasutamine CSS-is

Oleme juba läbi võtnud omaduse margin, mis teeb taande väljapoole elemendi piiri. Samuti on olemas väga sarnane omadus padding, mis teeb taande sissepoole elemendi piiri.

Vaatame nüüd näidete varal, kuidas see omadus töötab. Alustuseks toon ploki ilma taandeteta (selle tekst on piiride vastu):

html<div id="elem">
  some long text
</div>
css#elem {
  width: 300px;
  border: 1px solid red;
  text-align: justify;
}

Результат:

Nüüd määrame padding väärtuseks 30px kõikidele külgedele:

html<div id="elem">
  some long text
</div>
css#elem {
  padding: 30px;
  width: 300px;
  border: 1px solid red;
  text-align: justify;
}

Результат:

Задание 1

Korrake lehte antud näidise järgi:

Задание 2

Korrake lehte antud näidise järgi: