html - 导航中的类仅适用于 firefox 中的检查元素

Question

我想为我的网站编写一个导航栏。它应该支持移动和桌面 View 。现在我想在 nav 中添加一个 div 但它不起作用，但是当我使用 firefox 中的检查元素分析它并刷新它工作的站点时。谁能帮帮我？

这是导航的代码片段:

/* Here is the css declaration of the drop class: */

.drop {
  width: 50px;
  height: 50px;
  background-color: #FFFFFF;
  cursor: pointer;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

<nav class="nav" id='navigation'>
  <ul style="font: normal 14px Tauri, serif ">


    <li style="float: left; border: none ">
      <a href='index.php'>test</a>
    </li>


    <button class="drop"></button>

Answer 1

实际上有一个“导航”但它没有高度。 我做了一个 Fiddle，在其中添加了一些高度和背景颜色，还删除了主体的边距，检查一下!

https://jsfiddle.net/tu9rh3sg/

这用于 HTML(我刚刚关闭了导航):

 <nav class="nav" id='navigation'>
  <ul style="font: normal 14px Tauri, serif ">


    <li style="float: left; border: none ">
      <a href='index.php'>test</a>
    </li>


    <button class="drop"></button>
    </nav>

这是 CSS(高度 + 背景色 + 边距)；

    .drop {
  width: 50px;
  height: 50px;
  background-color: #FFFFFF;
  cursor: pointer;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}
.nav {
  background-color: black;
  height: 50px;
}
body {
  margin: 0 auto;
  margin-top: -14px;
}

如果有帮助请告诉我! ☻