twitter-bootstrap-3 - 在小 scrn 处交换 2 列堆叠顺序-Bootstrap 推拉类或 float 修复?

标签 twitter-bootstrap-3

无论我做什么,我都无法让正确的列以 100% 宽度/小 scrns 推倒并首先堆叠。我试过 col-xs-pull/push-12 或 col-xs-pull/push-0。我也尝试弄乱 div float ,但无济于事。

我是否遗漏了一些明显的东西,或者我是否需要开始这个难题的第二阶段?

<div class="row>
<div id="main" class= "col-xs-12 col-xs-pull-? col-sm-8"></div>
<div id="r-column" class="col-xs-12 col-xs-push-? col-sm-4"></div>
</div>

最佳答案

如果您采用“移动优先”方法,则将 r 列首先放在标记中,然后相应地使用推/拉

<div class="row">
 <div id="r-column" class="col-xs-12 col-sm-push-8 col-sm-4">right</div>
 <div id="main" class="col-xs-12 col-sm-pull-4 col-sm-8">main</div>
</div>

http://www.bootply.com/121630

关于twitter-bootstrap-3 - 在小 scrn 处交换 2 列堆叠顺序-Bootstrap 推拉类或 float 修复?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22385447/

相关文章:

css - 使用display : flex?如何实现响应式设计

twitter-bootstrap-3 - 可以在 Bootstrap 下拉菜单中使用按钮而不是 anchor 吗

css - 无法在 Angular 2 中正确显示 Bootstrap Carousel

html - 在弹出窗口中添加 float div

html - 我如何将这些 Twitter bootstrap 3 导航栏链接居中?

jquery - 修改 bootstrap carousel 同时显示多张幻灯片

twitter-bootstrap - 使用 Bootstrap 3 自定义轮播

html - Bootstrap 子菜单拉伸(stretch)全屏并覆盖整个页面

html - 如何防止 Bootstrap 3 模式窗口之外的键盘焦点?

jquery - 使用不同的按钮打开/关闭 Bootstrap Accordion