分层<div></div>

Question

大家好，我已经到了谷歌的砖墙上:)

我试图将一个div (#menubar)分层到另一个div(#后台)上。

我的html是。。。。。

<div id="background"></div>
<div id="menubar"></div>

我的CSS是。。。。

#background {
Width:98%;
height:1000px;
position: relative;
background-color:#878787;
border-style:solid;
border-color:#003366;
border-width:10px;
z-index:1;
}

#menubar {
top:5;
left:0;
Width:50px;
height:50px;
position:relative;
z-index:2;
background-color:#CCCC99;
}

知道它为什么不起作用吗？谢谢

不好意思，这是个愚蠢的问题

这是一把小提琴http://jsfiddle.net/Pv3Tz/

Answer 1

你试过给它一个绝对的位置吗？将代码编辑为：

#background {
Width:98%;
height:1000px;
position: relative;
background-color:#878787;
border-style:solid;
border-color:#003366;
border-width:10px;
z-index:1;
}

#menubar {
top:5;
left:0;
Width:50px;
height:50px;
position:relative;
z-index:2;
background-color:#CCCC99;
}

还可以查看此链接以获得更多信息：w3schools.com

Answer 2

#background { 
position:absolute;
 }

底层需要的位置:绝对。

Answer 3

使用位置:绝对适用于您的月历：

#background {
Width:98%;
height:1000px;
position: relative;
background-color:#878787;
border-style:solid;
border-color:#003366;
border-width:10px;
z-index:1;
}

#menubar {
top:5px; /* --- Specify with either %, px's, or em --- */
left:0;  /* --- Specify with either %, px's, or em --- */
Width:50px;
height:50px;
position:absolute;
z-index:2;
background-color:#CCCC99;
}