Css 如何修复Firefox和Internet Explorer中的导航菜单？

在Firefox上，导航菜单显示在导航菜单应该位于的区域下方。在Internet Explorer上，下拉列表不起作用。它在Chrome和Opera上运行良好。我对子菜单使用了

visibility:hidden

和

visibility:visible

以下是Firefox上的外观：

下面是它的外观： 菜单在屏幕上一直显示

以下是HTML：

<div id="header">
        <img src="jawapa-logo.png" id="logo" height="60px" width="60px;">
        <ul>
          <li>
            <a href="index.html">
              Home
            </a>
          </li>
          <li>
            <a>
              My Projects &#9663;
            </a>
            <ul>
              <li>
                <a href="upside-down-text.html">
                  Upside Down Text
                </a>
              </li>
              <li>
                <a href="random-number.html">
                  Random Number
                </a>
              </li>
              <li>
                <a href="code-editor.html">
                  Code Editor
                </a>
              </li>
              <li>
                <a href="templates.html">
                  Website Templates
                </a>
              </li>
              <li>
                <a href="snake-game.html">
                  Snake Game
                </a>
              </li>
              <li>
                <a>
                  Random &#9657;
                </a>
                <ul>
                  <li>
                    <a href="matrix.html">
                      Matrix
                    </a>
                  </li>
                </ul>
              </li>
            </ul>
          </li>
          <li>
            <a href="contact.html">
              Contact
            </a>
          </li>
          <li>
            <a href="about.html">
              About
            </a>
          </li>
        </ul>
      </div>

---

问题是您没有在

#标题ul

上定义

top

值

这应该可以解决这个问题：

#header ul {
  ...
  top: 0;
}

#header ul {
  ...
  top: 0;
}