CSS හි padding ඉන්ඩෙන්ට් සමඟ වැඩ කිරීම

අපි border එකේ සිට පිටතට ඉන්ඩෙන්ට් සාදන margin ගුණාංගය සමඟ වැඩ කර ඇත. ඒ හා සමාන ඉතා සමාන ගුණාංගයක් වන padding ද ඇත, එය border එකේ සිට ඇතුල් පසට ඉන්ඩෙන්ට් සාදයි.

දැන් අපි උදාහරණ මගින් මෙම ගුණාංගය ක්‍රියා කරන ආකාරය බලමු. පළමුව, ඉන්ඩෙන්ට් නොමැති බ්ලොක් එකක් ඉදිරිපත් කරමි (එහි ටෙක්ස්ට් එක borders වලට ඇලී ඇත):

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;
}

Результат: