在Firefox中从顶部删除多余的空白

Question

页面的某些部分在 Firefox 中看起来与在 chrome 中不同。 这就是它在 chrome 中的样子：

这是它在 Firefox 中的样子：

HTML 代码：

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  margin-top: 0;
  padding-top: 0;
  overflow-x: hidden;
}
@media print {
  body {
    margin-top: 0 !important;
  }
}
body {
  background-color: white;
  color: black;
  padding: 0;
  margin: 0;
  min-height: 100%;
  min-width: 100%;
  overflow-x: hidden;
}
.rowa {
  padding: 10px;
  background-color: black;
  color: white;
  height: 100%;
  margin: 0;
}
#title {
  font-size: 36px;
  display: inline-block;
  color: white;
}

<nav class="navbar navbar-inverse " id="navtop">
  <div class="container-fluid rowa">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span> 
      </button>
      <a class="navbar-brand" href="#" id="title">title</a>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav navbar-right  menu " id="menu1">
        <li><a href="#" id="home1"> Home</a>
        </li>
        <li><a href="#" id="book"> Booking</a>
        </li>
        <li><a href="#" id="rate">Rates</a>
        </li>
        <li><a href="#" id="abt"> About us</a>
        </li>
        <li><a href="#" id="contact"> Contact us</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

我无法删除顶部的多余空间和导航栏中的多余填充。

我已将 css 中 html 和 body 的边距和填充设置为 0，并且 min-width 和 min-height 为 100%。

Firefox 中的图像和表单之间还有额外的间距（适用于小屏幕设备）。

如何在 Firefox 中去掉这些多余的空格？请帮忙。

Answer 1

将 CSS 中的使用高度规则调整为 id="menu1"。