CSS ရှိ float ဂုဏ်သတ္တိနှင့် block များစွာ

ယခု HTML ကုဒ်တွင် div-သားတစ်ခုတည်းမဟုတ်ဘဲ နှစ်ခုရှိပြီး ၎င်းတို့နှစ်ခုလုံးအတွက် float ကို left တန်ဖိုးသတ်မှတ်ထားသည်ဆိုပါစို့။ ဘာဖြစ်သွားမလဲဆိုတာ ကြည့်ကြရအောင်။

<div class="parent">
	<div class="child">1</div>
	<div class="child">2</div>
	some long text
</div>

.parent {
	border: 1px solid red;
	text-align: justify;
}
.child {
	float: left;
	width: 200px;
	height: 100px;
	border: 1px solid green;
}

ဒီတော့ မြင်တွေ့ရသည်အတိုင်း၊ block-သားနှစ်ခုသည် တန်းလိုက်စီစဉ်သွားပြီး၊ HTML ကုဒ်ရှိ ပထမ block သည် ဘယ်ဘက်တွင်တည်ရှိမည်ဖြစ်သည်။

ယခု left တန်ဖိုးအစား right တန်ဖိုးကို ရေးကြည့်ပါ။ ဤအခြေအနေတွင် block များသည် ညာဘက်တွင် မျောနေမည်ဖြစ်ပြီး၊ ၎င်းတို့၏ အစီအစဉ်သည် HTML ကုဒ်ရှိအစီအစဉ်နှင့် နှိုင်းယှဉ်ပါက ပြောင်းပြန်ဖြစ်သွားမည်ဖြစ်သည်။

<div class="parent">
	<div class="child">1</div>
	<div class="child">2</div>
	some long text
</div>

.parent {
	border: 1px solid red;
	text-align: justify;
}
.child {
	float: right;
	width: 200px;
	height: 100px;
	border: 1px solid green;
}

ဤနမူနာအတိုင်း စာမျက်နှာကို ပြန်လုပ်ကြည့်ပါ။