所以我在 div 元素内有 3 个并排的 div,在它们之后有另一个 div。但是,此 div 与其他 div 重叠。如何让“footer”出现在“main”之后?
.main {
height: 500px;
width: 100%;
position: absolute;
}
.filter {
background: red;
height: 100%;
float: left;
width: 20%;
}
.post-bar {
background: blue;
height: 100%;
float: left;
width: 60%;
}
.advertisment {
background: green;
height: 100%;
float: left;
width: 20%;
}
.footer {
height: 250px;
width: 100%;
background: black;
position: relative;
}
<div class="main">
<div class="filter">
</div>
<div class="post-bar">
</div>
<div class="advertisment">
</div>
</div>
<div class="footer"></div>
最佳答案
只需在主类中去掉 position:absolute
即可:
.main {
height: 500px;
width: 100%;
}
.filter {
background: red;
height: 100%;
float: left;
width: 20%;
}
.post-bar {
background: blue;
height: 100%;
float: left;
width: 60%;
}
.advertisment {
background: green;
height: 100%;
float: left;
width: 20%;
}
.footer {
height: 250px;
width: 100%;
background: black;
position: relative;
}
<div class="main">
<div class="filter">
</div>
<div class="post-bar">
</div>
<div class="advertisment">
</div>
</div>
<div class="footer"></div>
关于html - 如何阻止此 div 重叠?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49110148/