0

我有两个<div>,我很难订购它们。请教我并帮助我。

<div class="menubar">
    <ul class="menu">
        <li class="itmes"></li>
        <li class="itmes"></li>
        <li class="itmes"></li>
    </ul>
</div>
<div class="b_header">

</div>

这是相关的CSS。

.menubar{
width: 110%;
background-color: #000000;
margin-top: 32px;
height: 35px;
display: block;
position: absolute;
margin-left: -20px;
vertical-align: middle;
text-align: center;}

.b_header{
width: 110%;
background: url('./img/b_header.gif');
margin-left: -20px;
height: 15px;
position: inherit;
margin-top: 0px;}

我希望并期望看到<div class="b_header">下面的内容,<div class="b_header">但事实并非如此。

解决办法是什么?

4

2 回答 2

4

消除

position:absolute;

它会起作用。绝对定位将从页面流中删除菜单,因此它下面的标题 div 将有效地假装菜单不存在。

或者(如果你需要position:absolute)你可以通过给标题一个来强制你的标题在菜单下方margin-top:67px;

于 2012-09-25T14:35:07.793 回答
0

你的菜单栏的垂直对齐是中间的,所以我怀疑 b_header 被放在它上面?尝试垂直对齐:顶部;

于 2012-09-25T14:34:40.603 回答