19.11.22.금 TIL

ki_blank·2019년 11월 22일
0

Today I Learn

목록 보기
8/36

grid

  • align-content, justify-content : flex와 비슷하게 동작한다.
  • place-content : align-content와 justify-content를 동시에 사용할 수 있다.
.container {
  	display: grid;
  	grid-template-columns: repeat(3, 100px);
  	grid-auto-rows: 100px;
	place-content: center /* align-content */ end /* justify-content */;
}

값을 하나만 적으면 "start"는 default 값과 같다. "end"는 오른쪽 바닥으로 이동한다.
"center"는 가운데로 이동한다.

  • align-items, justify-content : 각 태그의 내용들의 위치가 이동한다.
  • place-items : align-items, justify-items를 동시에 사용할 수 있다.
profile
갈고 닦자.

0개의 댓글