Bootstrap - 无论网格宽度如何，如何让两个网格列并排放置答案

【问题标题】：Bootstrap - How do I make two grid cols position side by side regardless of grid widthBootstrap - 无论网格宽度如何，如何让两个网格列并排放置
【发布时间】：2017-06-17 14:10:03
【问题描述】：

我正在尝试制作两个要并排渲染的 div（引导列）。

对于 XL、LG 和 MD 案例，我的宽度索引为 9，但尽管父 div 上有足够的空间可以容纳（由于每个 9 的宽度加起来为 18），但无法使超大的 div 水平排列。

首先，这在 Bootstrap 中是否可行，如果不可行，需要合并哪些 css 模块来呈现效果？

   <div class="row">
    <div class="col-xl-9 col-lg-9 col-md-9 col-sm-12 col-xs-12">
          First Container
    </div>
    <div class="col-xl-9 col-lg-9 col-md-9 col-sm-12 col-xs-12">
          Second Container
    </div>
    </div>

【问题讨论】：

标签： html css twitter-bootstrap

【解决方案1】：

要并排渲染它们，使用下面的 CSS 代码 col-xs-offset-2 将使其与第一个容器相距 2 倍

<div class="row">
        <div class="col-xs-5 ">
              First Container
        </div>
        <div class="col-xl-5 col-xs-offset-2">
              Second Container
        </div>
        </div>

【讨论】：

感谢@Anonymous，我的 div 在左侧容器中太小了。我试图将它们（两个 div）渲染为接近每个父 div 的 50%。 col-xx-6 或 col-xx-5 太窄了，这就是为什么我尝试 col-xx-9，它与我的一个 div 上的 50% 匹配，但另一个低于第一个 div。
如果你想让它们并排渲染直到 md-screen 然后在我的代码中使用 md 代替 xs 来解决问题

【解决方案2】：

将你的 col-xs 从 12 更改为 6

【讨论】：

col-sm 也
我需要 12，因为我想在小型设备上占据全宽。
对不起，我第一次读错了你的问题。 2 个宽度加起来应该是 12。我认为 bootstrap 使用 12 col 框架。
尽管有这个要求，我可以让 div 并排对齐，即使我使用 css 吗？
我确定如果你给他们独特的类，并以 css 为目标，你可以覆盖他们的默认编码。