html - 将左边的div float 在右边的底部

Question

这是我当前的 html:

.left { width:50%; float:left; }
.right { width:50%; float:left; }

    <div class="container">
        <div class="left">This is left content</div>
        <div class="right">This is left content</div>
    </div>

使用此 css，对于较小的分辨率，right div 位于 left div 下方，但我想要相反，我希望 left div 位于下方正确。

这可能吗？

谢谢!

更新:

抱歉，如果我的问题不够清楚，我将媒体查询用于响应式布局。我已经为不同的屏幕分辨率应用了媒体查询。我想做的是维护桌面的顺序，即 LEFT div 然后是 RIGHT div。但对于移动设备，LEFT DIV 应显示在 RIGHT div 下。@GCyrillus 示例代码正是我想要的。如果其他人遇到同样的问题，这里是解决方案。

http://codepen.io/anon/pen/VYGKjp

Answer 1

您可以在这里做两件事，将它们 float 到右侧而不是左侧，或者按如下方式更改您的标记:

<div class="container">
    <div class="right">This is left content</div>
    <div class="left">This is left content</div>
</div>