CSS：漂浮的孩子在漂浮父母缩小的窗口之前做出反应

Question

我有两个带显示的浮动div：内联块和宽度：auto（“适应内容”）。在第二个div中，有两个浮动子div。是否可以指定“浮动顺序”，以便子父在父母使用CSS之前对缩小的浏览器窗口做出反应？（参见附图）。谢谢你的任何建议！

Answer 1

尝试为此目的使用媒体查询。

你可以参考这个

1）Media_queries

2）css-tricks

Answer 2

试试这个。正如其他人所提到的，您可能需要媒体查询来对此进行微调。

<强> FIDDLE

标记

<div class="box1"></div>
<div class="box2">
    <div class="box"></div>
    <div class="box"></div>
</div>

CSS

.box1
{
    width: 48%;
    height: 300px;
    background: blue;
    float:left;
    margin: 0 10px 30px 0;
    min-width: 150px;
    overflow: auto;
}
.box2
{
    width: 40%;
    height: 250px;
    background: blue;
    overflow: hidden;
    max-width: 250px;
    min-width: 120px;

}
.box
{
    background: aqua;
    float:left;
    width: 100px;
    height: 100px;
    margin: 10px;
}