CSS гридларида ғуррат бирликлари fr

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: 1fr 0.5fr 2.5fr;
	border: 2px solid #696989;
	padding: 10px;
	width: 600px;
}
#parent > div {
	padding: 10px;
	border: 1px solid #696989;
}

Сизнинг гридингизда учта устун бўлсин. Учинчи устун биринчи ва иккинчи устунлардан 1.5 марта катта бўлишини таъминланг.

Сизнинг гридингизда учта устун бўлсин. Иккинчи устун биринчи устундан 1.5 марта катта, учинчи устун эса биринчи устундан 2.5 марта катта бўлишини таъминланг.