Savybė grid-auto-columns

Savybė grid-auto-columns nurodo stulpelių kiekį ir plotį, kurį užims elementas netiesioginiame gride. Netiesioginis gridas - gridas, kuris sukuriamas automatiškai, kai elementai išeina už jau pažymėto grido ribų. Savybės reikšmėje nurodome stulpelių plotį bet kokiame vienetuose dydžiams. Savybė nurodoma tėvinėje elemento ir nustato potūkinių elementų stulpelių plotį.

Sintaksė

cssselektorius {
  grid-auto-columns: stulpelio plotis;
}

Pavyzdys

Nustatykime stulpelių plotį mūsų elementams netiesioginiame gride:

html<div id="parent">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
</div>
css#parent {
  display: grid;
  grid-template-rows: 40px 40px;
  grid-auto-columns: 200px;
  border: 2px solid #696989;
  padding: 10px;
}
#parent > div {
  padding: 10px;
  border: 1px solid #696989;
}

Результат:

Taip pat žiūrėkite