CSS gridlarida kasr birliklari fr
fr birliklarida ko‘rsatilgan qiymatlar
kasr shaklida bo‘lishi mumkin. Keling
oldingi misolni o‘zgartirib, ikkinchi va uchinchi
ustunlar uchun kenglikni kasr sonlarda
belgilaymiz:
<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;
}
:
Faraz qilaylik, sizning gridingizda uchta ustun bor.
Uchinchi ustun birinchi va ikkinchi ustunlardan
1.5 marta katta bo‘lishini ta’minlang.
Faraz qilaylik, sizning gridingizda uchta ustun bor.
Ikkinchi ustun birinchi ustundan 1.5 marta
katta, uchinchi ustun esa birinchi ustundan
2.5 marta katta bo‘lishini ta’minlang.