Question

这些按钮设置为当页面大小为xs时（它们延伸到页面的整个宽度）但当它进入col-sm大小或更高时，我希望它删除整个宽度，使它恢复正常，没有网格化。我当时认为应该有更大尺寸重置网格的东西，但没有找到它。我尝试使用*或#代替0，但这不起作用。有什么建议？这是代码：

 <div class="row">
    <button class="col-xs-12 col-sm-0">Start</button>
    <button class="col-xs-12 col-sm-0">Back</button>
    <button class="col-xs-12 col-sm-0">Next</button>
 </div>

Answer 1

我不确定我的问题是否100％，但这是我的解决方案。

http://jsfiddle.net/m0nk3y/Zfbk5/

您需要添加一些自定义CSS，以将宽度恢复为＆＃34;自动＆＃34;。

button.col-sm-0 {
    width: auto;
}

Answer 2

我很想看到其他解决方案更多支持bootstrap，但其中一个是制作包含相同按钮的2个div，只是根据视口更改显示的内容。

<--Only xs viewports -->
  <div class="row col-xs-12 hidden-sm hidden-md hidden-lg">
    <button>Start</button>
    <button>Back</button>
    <button>Next</button>
 </div>
<--All but xs viewports -->
 <div class="row hidden-xs">
    <button>Start</button>
    <button>Back</button>
    <button>Next</button>
 </div>

Bootstrap网格重置大小

2 个答案: