Html 如何将一个元素放置在另一个元素下方？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/40676648/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I position one element below another?
提问by khalid J-A
I want to put one element under another element. I am using position: absolutein CSS.
我想将一个元素放在另一个元素下。我position: absolute在 CSS 中使用。
.first{
width:70%;
height:300px;
position:absolute;
border:1px solid red;
}
.second{
border:2px solid blue;
width:40%;
height:200px;
} <div class="first"></div>
<div class="second"></div>I want the blue box to be positioned under the red box. How could I achieve this?
我希望蓝色框位于红色框下方。我怎么能做到这一点？
回答by Mudassar Saiyed
just give position : relative to second div and top:315px or what ever you want
只需给出位置：相对于第二个 div 和 top:315px 或任何你想要的
.first{
width:70%;
height:300px;
position:absolute;
border:1px solid red;
}
.second{
border:2px solid blue;
width:40%;
height:200px;
position: relative;
top: 315px;
}<html>
<head>
</head>
<body>
<div class="first"></div>
<div class="second"></div>
</body>
</head>回答by Banzay
Here is a solution:
这是一个解决方案：
.first{
width:70%;
height:300px;
position:absolute;
border:1px solid red;
box-sizing: border-box;
}
.second{
position: relative;
border:2px solid blue;
width:40%;
height:200px;
top: 300px;
box-sizing: border-box;
}<div class="first"></div>
<div class="second"></div>And you can to not point position, because divis block element and will be placed at new line by default.
并且您可以不指向position，因为它div是块元素，默认情况下将放置在新行。
.first{
width:70%;
height:300px;
border:1px solid red;
}
.second{
border:2px solid blue;
width:40%;
height:200px;
}<div class="first"></div>
<div class="second"></div>回答by jumpOnCommand
Try using clear: both;.
尝试使用clear: both;.
The clear property specifies on which sides of an element floating elements are not allowed to float.
clear 属性指定不允许浮动元素在元素的哪一侧浮动。
