Знакомство с гридами(32/32) с помощью grid-template-areas


решил сделать через grid-template-areas, только хз почему гном и эльф поменялись местами

grid {
display: grid;
gap: 10px;

grid-template-areas:
“header header header header”
“gnome elf troll sidebar”
“video video desc sidebar”;

}

.site-heading {
grid-area:header;
height:22px;
}

.good {
height:100px;
}

.good:first-child {
grid-area:elf;

}

.good:nth-child(2) {
grid-area:gnome;

}

.good:last-child {
grid-area:troll;

}

.video {
width:270px;
height:140px;
grid-area:video;
}

.sidebar {
width:110px;
grid-area:sidebar;

}

.description {
width:110px;
grid-area:desc;
}