Skip to content

Grid Row Span

Merentangi baris grid

Sintaks

layout="row-span:[value]"

Nilai

NilaiCSS OutputHuraian
1-12grid-row: span {n} / span {n}Merentangi N baris
fullgrid-row: 1 / -1Merentangi semua baris

Contoh

html
<div layout="row-span:2">Spans 2 rows</div>

Pratonton

Rentang Baris

layout="row-span:2" - Item merentangi berbilang baris

row-span:21234
Lihat Kod
html
<div layout="grid grid-cols:3 grid-rows:2" space="g:small p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <span layout="row-span:2 flex center" space="p:small" visual="bg:primary text:white rounded:small">row-span:2</span>
  <span space="p:small" visual="bg:neutral-300 dark:bg:neutral-700 text:neutral-800 dark:text:neutral-200 rounded:small" layout="text:center">1</span>
  <span space="p:small" visual="bg:neutral-300 dark:bg:neutral-700 text:neutral-800 dark:text:neutral-200 rounded:small" layout="text:center">2</span>
  <span space="p:small" visual="bg:neutral-300 dark:bg:neutral-700 text:neutral-800 dark:text:neutral-200 rounded:small" layout="text:center">3</span>
  <span space="p:small" visual="bg:neutral-300 dark:bg:neutral-700 text:neutral-800 dark:text:neutral-200 rounded:small" layout="text:center">4</span>
</div>