CSS grid-auto-flow 속성

열별로 자동 배치 항목 삽입:

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

정의 및 사용

속성 은 grid-auto-flow자동 배치 항목이 그리드에 삽입되는 방식을 제어합니다.

기본값:	열
상속:	아니요
애니메이션 가능:	예. 애니메이션 가능 에 대해 읽기
버전:	CSS 그리드 레이아웃 모듈 레벨 1
자바스크립트 구문:	object .style.gridAutoFlow="행 밀도"

표의 숫자는 속성을 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.

Property
grid-auto-flow	57	16	52	10	44

grid-auto-flow: row|column|dense|row dense|column dense;

Value	Description	Play it
row	Default value. Places items by filling each row
column	Places items by filling each column
dense	Place items to fill any holes in the grid
row dense	Places items by filling each row, and fill any holes in the grid
column dense	Places items by filling each column, and fill any holes in the grid

"dense" 값을 추가하여 그리드의 구멍을 채우십시오.

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