clear ဂုဏ်သတ္တိ

clear ဂုဏ်သတ္တိသည် float ဂုဏ်သတ္တိဖြင့် သတ်မှတ်ထားသော အခြားအစိတ်အပိုင်းများ၏ ဝန်းရံမှုကို ပယ်ဖျက်ပေးသည်။ အောက်ပါတန်ဖိုးများကို ယူနိုင်သည်- none (၎င်း၏လုပ်ဆောင်ချက်ကို ပယ်ဖျက်သည်), both (ဘယ်ဘက်နှင့် ညာဘက်တစ်ချိန်တည်းမှ float ကို ပယ်ဖျက်သည်), left (ဘယ်ဘက်မှ float ကို ပယ်ဖျက်သည်), right (ညာဘက်မှ float ကို ပယ်ဖျက်သည်)။

ဝါကျဖွဲ့ပုံ

selector {
	clear: none or left or right or both
}

ဥပမာ

ဓာတ်ပုံ၏ ဘယ်ဘက်မှ စာသားဝန်းရံမှုကို ပယ်ဖျက်ကြည့်ရအောင်-

<img class="image" src="bg.png" alt="">
<div class="txt">
	<p>
		text text text text text text
		text text text text text text
		text text text text text text
		text text text text text text
	</p>
</div>

.image {
	float: left;
	padding-right: 10px;
}
.txt {
	clear: left;
}

ဥပမာ

ယခုတစ်ခါ ဓာတ်ပုံ၏ ညာဘက်မှ စာသားဝန်းရံမှုကို ပယ်ဖျက်ကြည့်ရအောင်-

<img class="image" src="bg.png" alt="">
<div class="txt">
	<p>
		text text text text text text
		text text text text text text
		text text text text text text
		text text text text text text
	</p>
</div>

.image {
	float: right;
	padding-right: 10px;
}
.txt {
	clear: right;
}

ဥပမာ

clear ဂုဏ်သတ္တိ၏ လုပ်ဆောင်ချက်ကိုယ်တိုင်ကို ပယ်ဖျက်ကြည့်ရအောင်-

<img class="image" src="bg.png" alt="">
<div class="txt">
	<p>
		text text text text text text
		text text text text text text
		text text text text text text
		text text text text text text
	</p>
</div>

.image {
	float: right;
	padding-right: 10px;
}
.txt {
	clear: none;
}

ဆက်လက်လေ့လာရန်

bottom ဂုဏ်သတ္တိ,
အရာသည် အစိတ်အပိုင်း၏ အောက်ခြေအစွန်း၏ တည်နေရာကို သတ်မှတ်ပေးသည်
top ဂုဏ်သတ္တိ,
အရာသည် အစိတ်အပိုင်း၏ အပေါ်ဆုံးအစွန်း၏ တည်နေရာကို သတ်မှတ်ပေးသည်
left ဂုဏ်သတ္တိ,
အရာသည် အစိတ်အပိုင်း၏ ဘယ်ဘက်အစွန်း၏ တည်နေရာကို သတ်မှတ်ပေးသည်
right ဂုဏ်သတ္တိ,
အရာသည် အစိတ်အပိုင်း၏ ညာဘက်အစွန်း၏ တည်နေရာကို သတ်မှတ်ပေးသည်
ပဏာမ-အစိတ်အပိုင်း ::backdrop,
အရာသည် ပထမဆုံးအစိတ်အပိုင်းပြီးနောက် တည်နေရာကို သတ်မှတ်ပေးသည်
caption-side ဂုဏ်သတ္တိ,
အရာသည် ဇယားခေါင်းစဉ်၏ တည်နေရာကို သတ်မှတ်ပေးသည်