调整resize css上的div位置

Question

在页面上有两个相邻的div。现在，当我调整浏览器大小时，其中一个div与另一个重叠。我想要的是当没有足够的空间来显示两者时，将其中一个div向下移动（在另一个div下面）。可以用css实现吗？怎么样？

身体：

<div id="container">
   <h1 align="center">Title</h1>

   <div id="image1">
        <img src="back1.png" alt="a" />
   </div>

   <div id="image2">
       <img src="back2.png" alt="b" />
   </div>
</div>​

CSS

#container {position: relative; height:800px; width: 720px; background: #f0f0f0;}        
#container #image1 {position: absolute;  top: 10%; left: 0;}​
#container #image2 {position: absolute;  top:0;  right:0;}​

Answer 1

虽然你还没有发布你的代码，但我猜你通过使用相对或绝对定位来定位它们来设置div的样式，这使得它们重叠。我会改用display:inline-block;以你想要的方式制作相邻的div。

Click here以我的意思为例。尝试调整浏览器的大小以确定其有效。

Is this example更多你的意思？我只是用浮子。