CSS Grid / Flexbox 생성기

복잡한 레이아웃 코드를 눈으로 직접 확인하며 드래그 앤 드롭으로 설정하세요.

열 (Columns): 3

행 (Rows): 2

간격 (gap): 16px

CSS Code

.grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 16px;
}