html - 调整大小时如何自动将框移动到底部？

Question

<div class="main">
<div class="cleft">
</div>
<div class="cright">
</div>
</div>

.cleft{
    float: left;
    padding-left: 1%;
    width: 68%;
}

.cright{
    float: right;
    padding-right: 1%;
    width: 28%;
}

我有左右两个盒子。我想要一个东西，当有人调整宽度和宽度小于主容器(在我的例子中为 1075px)时，我想要放置左右框宽度:100%。

我如何使左右宽度为 100%，并且右侧将显示在底部。

注意:我对 ipad、iphone 进行了一些更改，在这种情况下它们可以正常工作。但是当有人调整浏览器大小时我如何申请那个东西。

Answer 1

我想你想使用媒体查询:

http://css-tricks.com/css-media-queries/

@media screen and (max-width: 1075px) {
   .cleft, .cright {
       float:none;
       width:50%;
       padding:none;
   }
}