TIL 0320

Yunji·2020년 3월 20일
0

TIL

목록 보기
8/54
post-thumbnail

오늘 목표

Grid ch.6_2 예제 프로젝트 🙆‍♀️
Grid ch.6_2 복습 퀴즈 🙆‍♀️

오늘 공부한 것

grid-auto-rows: 크기;
새로 추가되는 row 의 크기를 정한다
grid-auto-columns: 크기;
새로 추가되는 column 의 크기를 정한다
하지만 새로운 column 이 추가되는 위치에 따라 달라진다

예를 들어 2개의 row 와 2개의 column 이 있는 grid에 4개의 box 가 있는 상태에서
5번째 box가 row 3 / 4 , column 3 / 4 위치에 생긴다면 grid-auto-column 에서 정의한 크기로 적용된다.
5번째 box가 위치가 따로 정해지지 않았다면 기본적으로 새로운 row 를 생성해서 위치한다. 5번째 box가 grid-template-columns로 정의한 열 안에 있기 때문에 grid-auto-column 에서 정의한 크기가 적용되지 않는다.

어려운 부분

grid 관련 예제를 풀어보면서 헷갈리는 부분이 많았다. 공부하면서 빠트린 부분을 더 살펴봐야겠다.

0개의 댓글