CSS တွင် ဘလောက်အစုအဝေးများ ညှိခြင်း

margin ဂုဏ်သတ္တိသည် အကွာအဝေးများ သတ်မှတ်ရန်အတွက်သာမက ဘလောက်အစုအဝေးများကို ဗဟိုချက်ညှိရန်အတွက်လည်း အသုံးပြုပါသည်။ ၎င်းအတွက် ညာဘက်နှင့် ဘယ်ဘက် အကွာအဝေးများကို auto တန်ဖိုးအဖြစ် သတ်မှတ်သင့်သည်။

အောက်ပါဥပမာတွင် အတွင်းဘလောက်သည် အလယ်ဗဟိုတွင် ရပ်တည်သွားပါမည်။

<div class="parent">
	<div class="child"></div>
</div>

.parent {
	border: 1px solid red;
}

.child {
	height: 100px;
	width: 200px;
	border: 1px solid green;
	margin: 10px auto;
}

သတိပြုပါ၊ ဤနည်းဖြင့် ဘလောက်အစုအဝေးများကိုသာ၊ အလျားလိုက်ညှိခြင်းကိုသာ နှင့် ၎င်းတို့အတွက် အကျယ်သတ်မှတ်ထားမှသာ ဗဟိုချက်ညှိနိုင်ပါသည်။

အကယ်၍ အပေါ်နှင့် အောက်အကွာအဝေး margin များ ကွဲပြားစွာလိုအပ်ပါက ဤကဲ့သို့ ရေးသားနိုင်ပါသည်။

.child {
	margin: 30px auto 10px auto;
}

တန်ဖိုးသုံးခုဖြင့်လည်း ပြန်လည်ရေးသားနိုင်ပါသည်။ ပထမတန်ဖိုးသည် အပေါ်အကွာအဝေးကို၊ တတိယတန်ဖိုးသည် အောက်အကွာအဝေးကို သတ်မှတ်ပြီး ဒုတိယတန်ဖိုးသည် ညာဘက်နှင့် ဘယ်ဘက်အကွာအဝေးများအတွက် auto တန်ဖိုးကို သတ်မှတ်ပေးပါမည်။

.child {
	margin: 30px auto 10px;
}

နမူနာပုံစံအတိုင်း စာမျက်နှာကို ပြန်လုပ်ပါ၊ စိမ်းလန်းသောဘလောက်များသည် ၎င်းတို့၏ မိဘအစုအဝေး၏ အလယ်ဗဟိုတွင် တည်ရှိစေရန် ပြုလုပ်ပါ။