我尝试搜索 Stack Overflow、mozilla 文档和 CSS 技巧来找出为什么我的 grid-template-areas 总是收到无效的属性值，但无法弄清楚。有人可以指出为什么我收到此错误消息以及我做错了什么吗？
我正在尝试创建一个计算器。为此，我尝试创建网格单元以将运算符和关键数字输入其中。
提前致谢。
html, body {
margin: 0;
padding: 0;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 100%;
}
#gridContainer {
border: 1px solid black;
display: grid;
grid-template-columns: 4rem 4rem 4rem 4rem;
grid-template-rows: 6rem 6rem 6rem 6rem 6rem 6rem;
grid-template-areas:
"s s s s"
"o o o o"
"n n n o"
"n n n o"
"n n n o"
"z z d c";
}<html>
<body>
<div id="gridContainer"> …