CSS Grid-də auto dəyəri
Grid-də sətir və sütun ölçülərini
təyin edərkən
auto dəyərindən istifadə etmək olar.
Bu halda,
bloklar sadəcə onlara mövcud olan
sərbəst yeri, piksel ilə təyin olunmuş
eni çıxmaqla, dolduracaq.
Gəlin nümunələr üzərində baxaq.
Gəlin birinci və üçüncü sütunlara piksel ilə sabit en təyin edək, ikinci sütun isə qalan yeri avtomatik olaraq doldursun:
<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>
#parent {
display: grid;
grid-template-columns: 100px auto 150px;
border: 2px solid #696989;
padding: 10px;
width: 600px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
:
Alt elementləri iki sütunda yerləşdirin:
birincisi 200px enində,
ikincisi isə qalan yeri doldursun.
Alt elementləri üç sütunda yerləşdirin:
birincisi 100px enində,
ikincisi 150px enində, üçüncüsü isə
qalan yeri doldursun.
