使用BootStrap嵌套Div Stack顺序

Question

我知道如何使用推拉类更改堆栈顺序，但据我所知（并尝试过），只有你有两列才有效。 在我的设计中，我有一个容器，左边有一个嵌套的盒子。我希望在移动设备上查看容器内容。

以下是桌面上的示例草图：https://db.tt/nZGvCih0

这就是我希望它在移动设备上看到的方式：https://db.tt/Td6PlwT5

现在，该框位于容器内容的顶部。

（我正在使用Bootstrap 3并且不想使用js）

Answer 1

我认为您可以隐藏div并在加载较小设备时显示另一个div。检查此链接可能会对您有所帮助 http://getbootstrap.com/css/#responsive-utilities

由于

Answer 2

你正在寻找的是'浮动：底部'css和唉，我的朋友，没有（参考：How can I position my div at the bottom of its container?）。

您可以考虑以下几种方法：

1. 创建两个div'内容'，一个用于移动设备，另一个用于桌面设备。您可以使用@sunilkjt提到的响应实用程序分别隐藏它们。
2. 在移动设备上使用CSS3响应式媒体查询在div'框'上执行“position: absolute”，因此将其置于底部。

如果您向我们提供您的html / css，我可以创建一个适合您需求的jsfiddle。