Bootstrap网格系统崩溃

Question

在大约990px​​的时候，我看到我的网格折叠成一个巨大的列...我更喜欢它没有这样做，你可以在屏幕上看到右边有很多空间......我需要吗？添加第二个col？

.col-md-12.col-sm-6
btn.btn.btn-primary( ui-sref='menus.new')
    |Create New Menu

.row
    .col-md-2
        h4 KEY
    .col-md-2.hidden-sm
        h4 CREATED
    .col-md-3.col-md-offset-3
        h4 ACTIONS

.row.form-group( ng-repeat='menu in menus')
    .col-md-2
        | {{menu.key}}
    .col-md-2.hidden-sm
        | {{::menu.created | date : 'medium' }}
    .col-md-3.col-md-offset-2
        .row
            .col-md-6
                button.btn.btn-default.btn-block(ui-sref="menus.edit({id: menu._id})")
                    | Edit
            .col-md-6
                button.btn.btn-danger.btn-block(ng-click="removeMenu(menu._id, $index)")
                    | Delete

我尝试隐藏创建的列无效

Answer 1

原因是当您尝试将其置于 900px 时，它会检测到它应该针对移动设备或平板电脑进行更改。这是关于 Bootstrap 的特殊之处，它会为您调整所有内容的大小，因此您不必编写媒体查询。最简单的方法是，在屏幕变小时指定您想要的列数，从而使用col-sm-*

解决问题的最简单方法是在col-sm- 'size you want from 1 to 12'旁边嵌入col-md-*

Answer 2

在修修补补之后我意识到..当你在引导程序中隐藏内容时，你必须明确地调出每个级别你想隐藏的内容。

你在我的屏幕上看到的......是在非常小的（又名xs）级别......我认为我隐藏的一切都在回到渲染视图中。 BAH

修复示例：

.row
    .col-md-2
        h4 KEY
    .col-md-2.hidden-sm.hidden-xs
        h4 CREATED