CSS Grid'de Pikseller ve fr Birimleri
Sütun genişliklerini aynı anda
piksel ve
fr cinsinden ayarlayabilirsiniz:
<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'inizde üç sütun olduğunu varsayalım.
İlk sütunun 100px kaplamasını,
geri kalan iki sütunun ise eşit boyutta
olmasını sağlayın.
Grid'inizde dört sütun olduğunu varsayalım.
İlk ve son sütunların 100px
kaplamasını, kalan sütunların ise kalan
alanı, üçüncü sütunun ikinci sütundan 1.5
kat daha büyük olacak şekilde bölmesini sağlayın.
