Css 为什么不是'；我的Wordpress菜单不能正常工作吗？

实际上，我正在关注一段Lynda.com视频，内容是关于使用下划线从头开始构建Wordpress网站

我们正在设计style.css中的下拉菜单

默认代码如下所示，运行良好：

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    float: left;
    position: absolute;
    top: 1.5em;
    left: -999em;
    z-index: 99999;
}

但是，由于我们需要更改外观，他指示我们将其更改为以下代码：

.main-navigation ul ul {
    position: absolute;
    left: 0;
    z-index: 99999;
    display: none;
    float: left;
    padding: 0;
    background: #4d4d4d;
    background: hsl(0, 0%, 30%);
}

突然，下拉列表没有响应

我想我指出了“显示：无”的问题，但去掉它只会造成混乱。我试着像这样添加背景色：

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    background: #4d4d4d;
    background: hsl(0, 0%, 30%);
    float: left;
    position: absolute;
    top: 1.5em;
    left: -999em;
    z-index: 99999;
}

但结果是这样的：

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    background: #4d4d4d;
    background: hsl(0, 0%, 30%);
    float: left;
    position: absolute;
    top: 1.5em;
    left: -999em;
    z-index: 99999;
}

显然，我希望这个下拉列表位于链接下方，而不是前面。有人能告诉我如何解决这个问题吗

编辑：我很感激到目前为止尝试回答问题的人，但两个答案都不正确。感谢David，我将代码放入了jsfiddle.net：

---

请让我知道，如果你们中的一个可以找到它，使用这个！谢谢大家!

带

左：-999em和
显示：无内容正在消失

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    background: #4d4d4d;
    float: left;
    position: fixed;
    top: 1.5em;
    left: 1.5em;
    z-index: 99999;
}

使用原始代码中使用的左位置值：

.main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
background: #4d4d4d;
background: hsl(0, 0%, 30%);
float: left;
position: absolute;
top: 1.5em;
left: 0;
z-index: 99999;

}

而不是：

.main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
background: #4d4d4d;
background: hsl(0, 0%, 30%);
float: left;
position: absolute;
top: 1.5em;
left: -999em;
z-index: 99999;
}

我仍然不知道为什么他的代码会破坏网站，但我确实解决了我遇到的问题。我想我应该把它贴出来，以防其他人也有类似的问题

我保留了原样的代码，但添加了背景色，并将“top”从1.5em更改为3em，以便正确加载

.main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left;
position: absolute;
top: 3.0em;
left: -999em;
z-index: 99999;
background: #9adcfd;

}

感谢所有尝试过的人
 没有上下文的代码（比如一些标记和周围的CSS）什么也说不出来，请尝试添加更多信息，以便人们可以为您提供帮助，否则这只是猜测显示：首次加载时，无用于隐藏菜单。Js用于显示正确的元素被其外观单击的时间。您的问题是您没有显示html。查看www.jsfiddle.net您可以在那里显示html和css，然后我们可以轻松地修改它并获得您想要的结果。（顺便说一句，右键单击并“查看源代码”以查找要输入的html）。css通常可以试着看，而不是这样做，而且很有效，但它并没有那么难……最终：）谢谢，@David。那太有帮助了。我将用链接编辑我的帖子。