CSS下拉菜单赢得'；鼠标悬停在环绕div之外时不显示

我正在使用一个简单的css下拉菜单，当我悬停列表时，下拉菜单会显示出来，但当我的鼠标移动到“#head”包装div之外时，列表就会关闭

头像是包装的菜单和我的标志和搜索栏。 content div包装了我的所有内容

当“head”div下面有内容时，比如说另一个“content”div，则会显示下拉列表，直到我将光标移到“head”div之外

div#内容{
显示：块；
宽度：972；
浮动：无；
位置：相对位置；
}
#顶部菜单{
浮动：对；
文本对齐：左对齐；
宽度：505px；
填充：5px0；
显示：内联块；
}
#顶部菜单{
列表样式类型：无；
浮动：对；
}
#顶级菜单{
显示：无；
}
#顶级菜单{
浮动：左；
填充：0 14px；
保证金：0；
宽度：自动；
}
#顶部菜单ul li：悬停ul{
显示：块；
位置：绝对位置；
}
#顶部菜单ul li：悬停ul li{
清除：左；
}
#顶部菜单a{
显示：块；
}

好的。。。我通过添加一个z索引来修复它，结果是附加在head div下面的content div覆盖了下拉框。所以在css中，我刚刚添加了：z-index:1000，然后它就工作了。谢谢大家。

您好，head元素的CSS是什么？您可以在JSFIDLE上复制一份来查看吗？实际上，您的代码运行良好：

div#content{
    display:block;
    width:972;
    float:none;
    position:relative;
}
#top_menu{
    float:right;
    text-align: left;
    width: 505px;
    padding: 5px 0 0 0;
    display: inline-block;
}

#top_menu ul{
    list-style-type:none;
    float:right;
}
#top_menu ul li ul{
    display:none;
}
#top_menu ul li{
    float: left;
    padding: 0 0 0 14px;
    margin: 0;
    width: auto;
}
#top_menu ul li:hover ul{
    display:block;
    position:absolute;
}
#top_menu ul li:hover ul li{
    clear: left; 
}
#top_menu a{
    display:block;
}



    <div id="head">
        <div id = "top_menu">
            <ul class="nav">
                <li><a href="index.php">Home</a></li>
                <li><a href="about.php">About</a>
                    <ul>
                        <li><a href="1.php">1</a></li>
                        <li><a href="2.php">2</a></li>
                        <li><a href="3.php">3</a></li>
                        <li><a href="4.php">4</a></li>
                        <li><a href="5.php">5</a></li>
                        <li><a href="6.php">6</a></li>
                    </ul>
                </li>
            </ul>

        </div>
        <div class="clear"></div>
        <div class="search">
            <form action="search.php" method="post">
                <input type="text" maxlength="30" width="40" />
                <input type="submit" value="submit" />
            </form>
            </div>
    </div>