Īpašība grid-auto-rows

Īpašība grid-auto-rows nosaka rindu skaitu un platumu, kādu elements aizņems netiešajā gridā. Netiešais grids - grids, kas tiek izveidots automātiski, kad elementi iziet ārpus jau norādītā grida robežām. Īpašības vērtībā mēs norādām rindu platumu jebkuros mērvienības izmēriem. Īpašība tiek norādīta vecākelementā un nosaka pēcteču elementu rindu platumu.

Sintakse

cssselektors {
  grid-auto-rows: rindu platums;
}

Piemērs

Uzstādīsim rindu platumu mūsu elementiem netiešajā gridā:

html<div id="parent">
  <div id="elem1">1</div>
  <div id="elem2">2</div>
  <div id="elem3">3</div>
  <div id="elem4">4</div>
  <div id="elem5">5</div>
</div>

css#parent {
  display: grid;
  grid-template-columns: 100px 200px;
  grid-auto-rows: 40px 60px 80px;
  border: 2px solid #696989;
  padding: 10px;
}
#parent > div {
  padding: 10px;
  border: 1px solid #696989;
}

Результат:

Skatiet arī