CSS网格:网格列排除间隙

CSS网格:网格列排除间隙,css,css-grid,Css,Css Grid,我使用CSS网格来实现以下功能。这就是我到目前为止所做的: .collection__wrapper { display: grid; grid-template-columns: repeat(6, minmax(200px, 1fr)); grid-template-rows: repeat(2, 1fr); column-gap: 20px; row-gap: 10px; } .collection__instructions { grid-column: 1 /

我使用CSS网格来实现以下功能。这就是我到目前为止所做的:

.collection__wrapper {
  display: grid;
  grid-template-columns: repeat(6, minmax(200px, 1fr));
  grid-template-rows: repeat(2, 1fr);
  column-gap: 20px;
  row-gap: 10px;
}

.collection__instructions {
  grid-column: 1 / 3;
}
有没有办法将最后一个输入的宽度从行的开始一直延伸到红线所在的位置?网格列:1/3不适用于我


谢谢。

网格列不包括结束值,因此必须提到结束值+1

.collection__wrapper {
  display: grid;
  grid-template-columns: repeat(6, minmax(200px, 1fr));
  grid-template-rows: repeat(2, 1fr);
  column-gap: 20px;
  row-gap: 10px;
}

.collection__instructions {
  grid-column: 1 / 4;
}

参考更多信息

你能分享到目前为止的结果吗?我分享了实际结果的屏幕截图。我用以下代码解决了它:
。收集指令{网格列:1/3;宽度:calc(100%+20px);}
谢谢你的回复。实际上,我用以下代码解决了这个问题:
.collect_uu指令{grid column:1/3;width:calc(100%+20px);}