在转移其他DIV的位置之前,让DIV调整到最小值

时间:2013-07-08 04:14:24

标签: html css html5 css3 responsive-design

我有两个div,其中一个填充了文本,我希望它具有流畅性/响应性:

{
max-width: 600px;
min-width: 380px;
float: left;
}

然后我有另一个div:

{
width: 340px;
float: left;
}

当浏览器全屏显示时,Wrapper设置为960px,完美对齐,看起来很棒。

我想要的是当浏览器窗口调整大小时第一个div调整大小时,当它达到最小宽度时,下一个div会跳下来。

我意识到我可能需要@media查询我根本不知道如何做到这一点。

1 个答案:

答案 0 :(得分:0)

@media only screen and (max-device-width: 480px) {   
    /* PUT THE CODE IN HERE */


    width: 100%;
    float: left;
    clear: both;

}

或使用html版本:

<link rel="stylesheet" media="screen and (max-width: 480px)" href="css/phone.css" />

然后只需将代码放入手机中,或者如果您需要响应布局 你应该使用百分比作为宽度。