我想用
HTML和CSS实现这个结果：
红色框是一个很大的内容(一个PDF内容),蓝色框是围绕它组织的.首先在它旁边然后,当有足够的空间时,在它下面.
我的HTML结构如下,但我可以改变它：
<div id="outerContainer">
<div id="bigRedBox"></div>
<div>
<ul id="blueContentList">
<li class="blueContent"></li>
<li class="blueContent"></li>
<li class="blueContent"></li>
<li class="blueContent"></li>
<li class="blueContent"></li>
</ul>
</div>
</div>
到目前为止,定位仍然如下：
我不知道如果没有设置两个容器(一个在侧面,一个在下面),这是可能的,我可以做,但会让我写很多JS.
解决方法
您可以对列表项执行类似的操作,当然,它没有响应,但您可以使用％或媒体查询来优化它.
#blueContentList li{
width: 100px;
height: 100px;
background-color: blue;
margin: 10px;
float: left;
}
