CSSda turli tomonlar uchun margin chet bo'shliqlari

Turli tomonlar uchun turli chet bo'shliqlarni belgilash uchun alohida xususiyatlar mavjud: margin-left - chap tomon uchun, margin-right - o'ng tomon uchun, margin-top - yuqori va margin-bottom - pastki tomon uchun.

Keling, misolni ko'rib chiqaylik:

html<div id="parent">
  <div id="child"></div>
</div>

css#parent {
  width: 300px;
  border: 1px solid red;
}
#child {
  margin-top:    10px; /* yuqoridan */
  margin-right:  20px; /* o'ngdan */
  margin-bottom: 30px; /* pastdan */
  margin-left:   40px; /* chapdan */
  
  height: 100px;
  border: 1px solid green;
}

Результат: