如果我有两个像这样设置的值框：

```{r}
bslib::layout_column_wrap(
  width = NULL,
  fill = FALSE,
  class = "d-grid",
  style = htmltools::css(grid_template_columns = "repeat(auto-fill, minmax(200px, 1fr))"),
  bslib::value_box("Value box", 1),
  bslib::value_box("Value box", 2)
)

![](https://i.stack.imgur.com/Lttml.png)

如何使用`grid-column: span 2`使第一个值框跨越2列？
目标是为特定网格元素设置此属性并保留内容换行。
我可以这样做：

#| classes: col_wrap
bslib::layout_column_wrap(
  width = NULL,
  fill = FALSE,
  class = "d-grid",
  style = htmltools::css(grid_template_columns = "minmax(200px, 2fr) minmax(200px, 1fr)"),
  bslib::value_box("Value box", 1),
  bslib::value_box("Value box", 2)
)

![](https://i.stack.imgur.com/Zq1lD.png)

但是如果浏览器窗口宽度太窄，则会出现水平滚动条。
我可以进入开发工具，将`style = "grid-column: span 2"`添加到第一个`div.html-fill-container`中，以获得我想要的结果：

![](https://i.stack.imgur.com/KxYrB.gif)

我尝试添加以下CSS代码块，但它没有工作：

#| include: false
div.bslib-column-wrap div:html-fill-container {
  grid-column: span 2
}