CSS гриддеги auto мааниси
Гридде катарлар жана тилкелердин
өлчөмдөрүн көрсөтүүдө
auto маанисин колдонсо болот. Бул учурда,
блоктор пиксел менен көрсөтүлгөн
тууралыкты алып салгандан кийин,
аларга бошогон бүт мейкиндикти
гана ээлейт.
Келгиле, мисалдар аркылуу карап көрөлү.
Келгиле, биринчи жана үчүнчү тилкелерге пикселде туруктуу тууралыкты көрсөтөлү, ал эми экинчи тилке калган бош орунду автоматтык түрдө ээлесин:
<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;
}
:
Бала элементтерди эки
тилкеге жайгаштырыңыз: биринчисинин тууралыгы 200px,
ал эми экинчиси
калган бош орунду ээлесин.
Бала элементтерди үч
тилкеге жайгаштырыңыз: биринчисинин тууралыгы 100px,
экинчиси 150px, ал эми үчүнчүсү
калган бош орунду ээлесин.