我正在尝试将元素放置到一个简单的 9x9 网格中，但是当我尝试将元素放置在左下角或右下角时，它们并没有停留在那里，而是最终出现在应有位置上方的一个方框中。这里的 JSFiddle 显示了我正在尝试的内容，但不起作用。
\n\n根据规范，在定义时放置一个.空框grid-template-areas就足够了\xe2\x80\xa6，但我也尝试使用正常布局grid-area: 1/2/3/4，但这也不起作用\xe2\x80\xa6
这就是我所拥有的，CSS：
\n\ngrid-template-areas: \n"topBar topBar topBar"\n". main ."\n"aboutDiv . optionsDiv";\ngrid-template-areas: \n"topBar topBar topBar"\n". main ."\n"aboutDiv . optionsDiv";\n/* solarized theme colors, trimmed for brevity */\r\n:root {\r\n\t--base2: #eee8d5;\r\n\t--base3: #fdf6e3;\r\n\t--yellow: #b58900;\r\n}\r\nbody {\r\n\tmargin: 0;\r\n\tbackground-color: var(--base3); \r\n\theight: 100%;\r\n}\r\n.wrapper {\r\n\twidth: 100vw;\r\n\theight: 100vh;\r\n \tdisplay: grid; \r\n\tgrid-template-columns: 0.1fr 0.8fr 0.1fr;\r\n grid-template-rows: 0.1fr 0.8fr 0.1fr;\r\n grid-template-areas: \r\n "topBar topBar topBar"\r\n ". main ."\r\n "aboutDiv . …