页面上有两个相邻的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;}
最佳答案
虽然您还没有发布您的代码,但我猜您是通过使用相对或绝对定位来设置 div 的样式,这会使它们重叠。我会改为使用 display:inline-block;
以您想要的方式制作相邻的 div。
Click here举个例子说明我的意思。尝试调整浏览器的大小以查看它是否有效。
Is this example更多你的意思?我只是使用了花车。
关于css - 在调整大小 css 上更改 div 位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11806205/