【问题标题】：Error while displaying row when resizing browser调整浏览器大小时显示行时出错
【发布时间】：2015-03-27 09:08:51
【问题描述】：

我正在使用 Bootstrap，但在显示某些按钮时遇到以下错误：

HTML 代码如下：

<div class="row" style="margin-top: 20px">
    <div class="col-lg-6 text-left">
        <button class="btn btn-primary profile-button">Save</button>
    </div>
    <div class="col-lg-6 text-right">
        <button class="btn btn-primary profile-button">Reset</button>
    </div>
</div>

自定义类的 CSS 是：

.profile-button {
    min-width: 125px;
}

该错误仅在我调整浏览器宽度时发生。附加的屏幕截图是当浏览器具有显示器宽度的一半时（所以 540 像素，给定我的分辨率）。我相信显示错误从 768px 宽度值开始。我目前使用的分辨率是 1920x1080。

我尝试将行包装在一个容器 div 中，以及一个同时具有容器和容器流体类的 div 中。

【问题讨论】：

标签： html css twitter-bootstrap

【解决方案1】：

只需在两个 div 中添加 col-xs-6 类

<div class="row" style="margin-top: 20px">
    <div class="col-lg-6 col-xs-6 text-left">
        <button class="btn btn-primary profile-button">Save</button>
    </div>
    <div class="col-lg-6 col-xs-6 text-right">
        <button class="btn btn-primary profile-button">Reset</button>
    </div>
</div>

DEMO

Bootstrap Grid

【讨论】：

工作就像一个魅力。谢谢！
最欢迎@SSJVegito。享受引导。添加图片了解更多详情。

【解决方案2】：

Bootstrap 在较小的设备上将一列放在另一列之下...您的列可能会变得全宽和堆叠，而不是保持一半大小。这是标准行为。

如果按钮必须并排放置，我建议使用您自己的类并浮动它们，确保最大宽度为 50%

【讨论】：