Html 将两个 div 放在另一个下面
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13750598/
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
Placing two divs one below another
提问by Rajaprabhu Aravindasamy
I am having some problems with placing two divs one below another.
I tried out some solutions found in Stackoverflow like below.
But Nothing seems to be working.
Code:
我在将两个 div 一个下一个放置时遇到了一些问题。
我尝试了在 Stackoverflow 中找到的一些解决方案,如下所示。
但似乎没有任何效果。
代码:
#wrapper {
position: absolute;
}
#up {
position: absolute;
float: left;
}
#down {
position: absolute;
float: left;
clear: left;
}
<div id="wrapper">
<div id="up"></div>
<div id="down"></div>
</div>
Here's My Attempt,
这是我的尝试,
Helps would be appreciated.
帮助将不胜感激。
回答by CM Kanode
Remove the CSS. DIV tags are block elements and would naturally flow down the page. You are floating them which would cause them to be displayed side by side.
删除 CSS。DIV 标签是块元素,自然会顺着页面向下流动。您正在浮动它们,这将导致它们并排显示。
Especially remove the "float" attributes.
特别是删除“浮动”属性。
回答by Magicmarkker
回答by Shmiddty
I'm not sure if you want the outer div to be greater than the height of the page, but that's what this does:
我不确定您是否希望外部 div 大于页面的高度,但这就是这样做的:
#DivSlider
{
width:100%;
position:absolute;
height:170%;
background-color:green;
}
#DivHome
{
height:26%;
background-color:orange;
border:1px solid black; /* You were missing the 'px' here */
}
#DivSkills
{
height:25%;
background-color:white;
border:1px solid black;
}?