Thuta Learning
ရှာဖွေရန်
IntermediateWeb Developmentbeginner

Margin

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

ဒီခန်းပြီးရင် ဘာတတ်သွားမလဲ

  • Element အချင်းချင်းအကွာအဝေးကိုထိန်းရန်

margin က element ရဲ့အပြင်ဘက်အကွာအဝေးပါ။ Section တွေကြား၊ heading နဲ့ paragraph ကြား၊ card တွေကြားမှာ spacing ခြားဖို့သုံးပါတယ်။ margin: 0 auto; က width သတ်မှတ်ထားတဲ့ element ကို အလယ်မှာထားချင်တဲ့အခါ အသုံးများပါတယ်။

css
.container {
  width: min(100% - 32px, 960px);
  margin: 0 auto;
}

.section-title {
  margin-bottom: 16px;
}
You should see
Container က screen အလယ်မှာနေပြီး mobile မှာလည်း ဘေးကပ်မသွားအောင် 32px spacing ရှိပါမယ်။

Warning

Margin collapse ဆိုတဲ့ behavior ကြောင့် vertical margin တွေ တစ်ခါတလေ မျှော်လင့်သလိုမပေါ်နိုင်ပါ။ Section spacing အတွက် padding ကိုလည်းစဉ်းစားပါ။

Margin | Thuta Learning