Design Study

grid-template-areas를 사용하며 하는 단순하지만 발견하기 어려운 실수가 있습니다. grid-template-areas를 사용하다가 갑자기 안되면 한 번 확인해보세요. 1. 따옴표(" , ')를 확인하세요 grid-template-areas로 영역을 이름으로 지정할 때는 따옴표(Quotation marks)를 사용해 구분합니다. 그리고 각 영역의 이름은 grid-area로 지정해주는데 grid-area는 따옴표가 필요없습니다. grid-area를 사용할 때는 따옴표(", ')를 쓰지 않습니다. grid-template-areas: "header header" "side main" "footer footer"; .header { grid-area: header; } .side { grid-ar..