grid - gap

beomhak lee·2024년 10월 29일

CSS

목록 보기
10/15

	<div class="grid-container">
		<div class="grid-item">A</div>
		<div class="grid-item">B</div>
		<div class="grid-item">C</div>
		<div class="grid-item">D</div>
		<div class="grid-item">E</div>
		<div class="grid-item">F</div>
		<div class="grid-item">G</div>
		<div class="grid-item">H</div>
		<div class="grid-item">I</div>
	</div>
	.grid-container {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(3, minmax(200px, auto));
		row-gap: 20px; 
	}

.grid-container {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(3, minmax(200px, auto));
		column-gap: 20px;
	}

	.grid-container {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(3, minmax(200px, auto));
		gap: 20px;
	}

0개의 댓글