Html 引导网格删除div之间的空间

我正在尝试使用引导网格并排显示2个div。问题是我不知道如何压缩div之间的空白，以便它们的内容可以并排显示，而中间没有空格

通常我会将两个div都向左浮动，或者将它们都设置为display:inline block，但我正在尝试使用更现代的技术。这是引导网格的正确用法，还是应该更多地用于显示诸如display:table之类的表格数据？如果不是，我应该在这种情况下使用什么现代技术

我正在寻找的左浮动视觉效果：

<div>
    <div style="float:left;">
        Test Content 1
     </div>
     <div style="float:left; margin-left:10px;">
        Test Content 2
     </div>
</div>

引导网格内容之间的空白空间：

<div class="row">
    <div class="col-xs-6">
        Test Content 1
     </div>
     <div class="col-xs-6">
        Test Content 2
     </div>
</div>

---

由于bootstrap4有一个no-glutters类，它将处理这个问题。 只需将其添加到row类中

<div class="row no-gutters">
    <div class="col-xs-6">
        Test Content 1
     </div>
     <div class="col-xs-6">
        Test Content 2
     </div>
</div>

以下是引导文档中关于它的更多详细信息：

---

谢谢，我之前看到过这个答案，但没有意识到它是针对bootstrap 4的。我现在正在努力把它拆下来，一旦我把它拆下来，我会把你标记为答案。编辑：对于一个现代化的网站，你会用这种技术吗？我看到flexbox网格也是bootstrap 4中的一个选项。@mgmedick这绝对是bootstrap的一种选择。当然，您也可以使用flexbox实现，但是如果您使用的是bootstrap，那么它们提供的所有类在现代开发中都是有效和可用的。如果您有一个页面，您不需要那么多引导组件，我个人建议您使用flexbox方法来避免开销，但这只是我自己的想法。Bootstrap非常精致和现代。