CSS Grid များတွင် Pixels နှင့် fr ယူနစ်များ

Column အကျယ်များကို Pixels များနှင့် fr တို့ဖြင့် တစ်ပြိုင်နက် သတ်မှတ်နိုင်ပါသည်။

<div id="parent">
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
</div>

#parent {
	display: grid;
	grid-template-columns: 100px 1fr 50px;
	border: 2px solid #696989;
	padding: 10px;
	width: 600px;
}
#parent > div {
	padding: 10px;
	border: 1px solid #696989;
}

သင့် Grid တွင် Column သုံးခုရှိသည်ဆိုပါစို့။ ပထမ Column သည် 100px ယူပြီး ကျန်နှစ်ခုသော Column များသည် အရွယ်အစား တူညီအောင် လုပ်ပြီး။

သင့် Grid တွင် Column လေးခုရှိသည်ဆိုပါစို့။ ပထမ Column နှင့် နောက်ဆုံး Column များသည် 100px စီယူပြီး၊ ကျန်ရှိနေသော Column များက ကျန်ရှိသောနေရာကို တတိယ Column သည် ဒုတိယ Column ထက် 1.5 ဆကြီးအောင် ခွဲဝေယူပြီး။