Bootstrap三列布局堆叠问题

Question

我在Bootstrap中使用了3列布局，包含导航，内容和功能。右侧的小部件，但是当屏幕处于移动视图时，希望布局如下所示进行堆叠;导航小部件然后是内容，请指教。

查看所需桌面的图像＆amp;移动布局顺序：

Answer 1

将块放入移动设备所需的顺序。然后将“小部件”拉到右侧：

<div class="container">
    <div class="row">
        <div class="span3 custom-nav"></div>
        <div class="span3 custom-widget pull-right"></div>
        <div class="span6 custom-content"></div>
    </div>
</div>​

在移动设备上时，请重置浮动：

@media (max-width: 767px) {
    [class*="span"].pull-right {
        float: none;
    }
}

还有一些事情：

• 我在这里使用custom前缀不会遇到Bootstrap的预定义.nav和.content类。
• 了解the fiddle的工作原理。
• 检查the related question我已回答。
• 欢迎使用StackOverflow。