grid 레이아웃 기본 개념!

그리드의 개념을 잡기 위한 노트..

큰 틀 짜기

1. 만들고자하는 레이아웃의 column, row의 숫자를 정하자!

ex)2개의 column, 3개의 row에 대한 레이아웃

2. 위에서 정한 column, row의 가장 많은 부분을 기준으로 속성값을 정하자!

3. 구도를 정하기 위해 각 부분에 대해 grid-area를 부여한다!

4. 부분들을 감싸고 있는 container class에 grid-template-area 속성을 추가한다!