header menu grid css

1.header { /* parent div with class header*/
2    display: grid;
3    gap: 0.5rem;
4    grid-template-columns:
5      max-content
6      auto
7      max-content;
8    grid-template-areas: "logo nav user";
9  
10    .logo { /* header child div class logo*/
11      grid-area: logo;
12    }
13    .nav { /* header child div class nav*/
14      grid-area: nav;
15      text-align: center;
16    }
17    .user { /* header child div class user*/
18      grid-area: user;
19    }
20  }