CSS grid-lerde “auto” bahasy
Grid-de hatarlaryň we sütünleriň
ölçeglerini görkezende
auto bahasyny ulanyp bolýar.
Bu ýagdaýda, bloglar elýeterli bolan
boş ýeri, piksel görkezilen ini
çykaryp, ýöne ýerleşdirer.
Mysallara seredeliň.
Birinji we üçünji sütünlere pikselde belgilenen ini görkezeliň, ikinji sütün bolsa galan ýeri awtomatik ýerleşdirsin:
<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;
}
:
Çagalary iki sütüne ýerleşdiriň:
birinji sütünüň ini 200px,
ikinji sütün bolsa galan ýeri
ýerleşdirsin.
Çagalary üç sütüne ýerleşdiriň:
birinji sütünüň ini 100px,
ikinji 150px, üçünji
sütün bolsa galan ýeri ýerleşdirsin.
