我正在设置一个 html 页面，其中内容根据 API 调用动态变化。根据内容长度，几乎每次进行新的 API 调用时，整个 css 不再起作用，div 开始相互重叠。有没有办法根据前一个元素的位置动态定位元素？
代码的结构是这样的:
<body>
<div class="container">
<div class="div1">
<p class="content">Dynamic content</p>
</div>
<div class="div2">
<p class="content">I am getting overlapped!</p>
</div>
</div>
</body>
CSS:
.container {
width: 70%;
padding-top: 40px;
position: relative;
left: 123px;
}
.div1 {
width: 80%;
top: 180px;
position: absolute;
}
.div2 {
position: absolute;
top: 380px;
width: 70%;
padding-bottom: 100px;
}
如果有人知道解决方案，我将不胜感激!
最佳答案
根据您的描述，听起来您不应该使用 position: absolute。默认的元素定位是 static ，它将在正常的文档流中定位元素，这样你的 .div2 就会跟随你的 .div1 (即使当动态内容的长度发生变化)。尝试从您的 css 中删除所有 position 行以了解我的意思。
关于html - 动态内容 : How to adjust div's position automatically?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54185827/