Padding for different sides in CSS

For internal padding, as well as external padding, there are properties for individual sides: padding-left, padding-right, padding-top and padding-bottom. Let's look at how they work:

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

css#elem {
  padding-top:    10px; /* above from above atop superiorly on the surface */
  padding-right:  20px; /* on the right to the right recto */
  padding-bottom: 30px; /* from below underarm */
  padding-left:   40px; /* left leftward leftwards */
  
  width: 300px;
  border: 1px solid red;
  text-align: justify;
}

Результат: