下拉标题问题

Question

嗨我有2个标题如下：

当我点击通知按钮时，下拉列表似乎打破了标题布局。以下是截图

通知下拉列表css如下

#notification_dropdown {
-webkit-box-shadow: 0 0px 13px rgba(20, 20, 20, 0.5);
-moz-box-shadow: 0 0px 13px rgba(20, 20, 20, 0.5);
box-shadow: 0 0px 13px rgba(20, 20, 20, 0.5);
background: white;
border: solid #888888 1px;
left: 300px;
width: 380px;
display: none;
float: left;
color: #444444;
}

我在这里做错了什么？

Answer 1

相对于其父级添加位置，并将绝对位置置于其自身。通过这样做，它将进入布局的分层，不会破坏现有的布局。

添加位置绝对像

 #notification_dropdown {
position:absolute;
z-index:1;
}

并添加相对于其父级的位置，如

parent_0f_dropdown
{
position:relative;
}