Html bootstrap4&；具有全长hr的列

我想让一条水平线穿过引导父元素指定的列宽。我使用的是Bootstrap4.1.1。代码如下

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<div class="row">
    <div class="col-xs-5">
        <p>Something here!</p>
        <hr/>
        <p>This list!</p>
    </div>
</div>

这里有东西


这个名单

标记继承父

属性，从而防止

标记扩展到引导容器类的长度

js小提琴在这里：

---

在引导程序4中没有类“col xs-*”这样的东西

---

使用

col-12

类而不是col-xs-5，使hr具有完整的宽度

Bootstrap-4已删除

*-xs-*

类的所有变体。因此，您应该使用

col-5

，而不是

col-xs-5

。但如果您想要全宽列，请使用

col-12

或

col

col-12

这里有东西


这个名单

hr{宽度：100vw；}