Trik CSS Grid yang Jarang Diketahui

CSS Grid adalah alat yang sangat kuat untuk membangun tata letak di web. Meskipun banyak dari kita yang menggunakan grid-template-columns dan gap, ada beberapa trik lain yang bisa membuat hidup kita lebih mudah.

1. Grid Template Areas

Banyak orang melewatkan grid-template-areas. Ini memungkinkan Anda memvisualisasikan layout Anda langsung di CSS:

.container {
  display: grid;
  grid-template-areas: 
    "header header header"
    "sidebar content content"
    "footer footer footer";
}

Sangat intuitif dan mudah dibaca!