是否需要使CSS网格列比其他列窄？

Question

如何使CSS网格列比其他列窄？ 该列设置为填充页面的整个左侧，我尝试用width: 10%对其进行缩小，并且确实变窄了，但是，现在变窄的列与下一个列之间仍然存在空白，如果我设置width: 100%，该列将填充该字段。 我的问题是：如何摆脱这个空间？ 行也一样。

.bodycontainer {
display: grid;
background-color: rgba(0,0,0,0);
width: 100%;
height: 100%;
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-columns: auto auto auto;
margin-top: 1.5%;}

.container1 {
height: 100%;
grid-row-start:1;
grid-row-end:3;
width:30%;
background-color: rgba(0,0,0,1);}

.container2 {
background-color: blue;
grid-column-start: 2;
grid-column-end: 5;
width: 100%;
height: 20%;}

.container1应该是侧边栏

Answer 1

我有点解决了。 显然问题是grid-template-columns: auto auto auto;来自正文容器。将其更改为grid-template-columns: 100px 30% 20%;，看来我可以随意使用这些尺寸。