当我不知道行数时,是否可以使网格项从第一行跨越到最后一行？
可以说我有以下html与未知数量的框.
如何.box从第一个网格线到最后一个网格线进行第三次跨度？
.container {
display: grid;
grid-template-columns: repeat(3, minmax(10rem, 1fr)) [last-col] 35%;
grid-template-rows: auto [last-line];
}
.box {
background-color: blue;
padding: 20px;
border: 1px solid red;
}
.box:nth-child(3) {
background-color: yellow;
grid-column: last-col / span 1;
grid-row: 1 / last-line;
}<div class="container">
<div class="box"></div>
<div class="box"></div>
<div class="box">3</div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>到目前为止，我已经开始使用CSS Grid迈出第一步了，之前使用Bootstrap plus Javascript编写了网格。我想从一开始就知道非常简单，如果我知道如何做的话。
假设我有一些这样的HTML：
<div class="container">
<div id="a">Blah</div>
<div id="b">Blurgh</div>
</div>
那我该怎么办？