填补空白，背景色

Question

找不到有关此问题的任何解决方案。我想知道如何消除两个彩色背景之间的白色间隙。我想知道什么是错误，如何解决这个问题。

这是分别用html和css编写的代码。

@import url('https://fonts.googleapis.com/css? family=Montserrat:400,600') * {
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Montserrat';
  padding: 0;
  margin: 0;
}

.header {
  position: relative;
  background-color: antiquewhite;
  overflow: hidden;
  clear: both
}

.header h1 {
  text-align: center;
  font-size: 3em;
  display: block;
  position: fixed;
  left: 0;
  top: 5%;
  width: 100%;
  height: 100%;
}

.header ul {
  text-align: right;
  list-style-type: none;
}

.header ul li {
  display: inline;
}

.header ul li a {
  position: relative;
  top: .5em;
  padding: 1em;
  margin-right: .4em;
  color: black;
  text-decoration: none;
  border: 2px solid gray;
  background: gray;
  border-radius: 50px;
}

.upperbody {
  color: green;
  background-color: aqua;
  clear: both;
}

<header>
  <div class="header">

    <h1> A Work In Progress</h1>
    <nav>
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="# ">Profile</a> </li>
        <li> <a href="#">Hobbies</a></li>
        <li><a href="#">Live Support</a></li>
      </ul>
    </nav>
  </div>
</header>
<div class="upperbody">
  <p> Hello, this is master </p>
</div>