Atribut grid-auto-flow CSS

Definisi dan penggunaan

Atribut grid-auto-flow mengendalikan bagaimana item pengisian otomatis dimasukkan ke dalam kisi.

Lihat pula:

Panduan CSS:Susunan Grid CSS

Contoh

Contoh 1

Masukkan item pengisian otomatis berurutan kolom:

.grid-container {
  display: grid;
  grid-auto-flow: kolom;
}

Coba sendiri

Contoh 2

Isi semua gap di dalam kisi dengan menambahkan nilai "dense":

.grid-container {
  display: grid;
  grid-auto-flow: baris dense;
}

Coba sendiri

Syntaks CSS

grid-auto-flow: baris|kolom|dense|baris dense|kolom dense;

Nilai atribut

Nilai Deskripsi
baris Nilai standar. Menempatkan item melalui pengisian setiap baris.
kolom Menempatkan item melalui pengisian setiap kolom.
dense Menempatkan item untuk mengisi gap apapun di dalam kisi.
baris dense Menempatkan item melalui pengisian setiap baris, serta mengisi gap apapun di dalam kisi.
kolom dense Menempatkan item melalui pengisian setiap kolom, serta mengisi gap apapun di dalam kisi.

Detil teknis

Nilai standar: baris
Warisan: Tidak
Pembuatan animasi: Dukung. Lihat:Properti animasi.
Versi: Modul Susunan Grid CSS Level 1
Syntaks JavaScript: object.style.gridAutoFlow="row dense"

Dukungan peramban

Angka di tabel menunjukkan versi pertama penggunaan yang mendukung sifat ini.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44