title: Webpage has top padding - cant get rid of it
body: <p>I'm going crazy trying to get rid of this small padding at the top of the webpage. It shows up in all browsers.
   Here is a pic<img src="https://i.stack.imgur.com/dWhnH.png" alt="pic"></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;meta charset=UTF-8" /&gt;
  &lt;link href="mainpage.css" rel="stylesheet" type="text/css" /&gt;
  &lt;title&gt;Mobile Development&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="topnavcontainer"&gt;
  &lt;ul id="navlist"&gt;
      &lt;li id="active"&gt;&lt;a href="#" id="current"&gt;Services&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#"&gt;Mobile&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#"&gt;Cloud&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#"&gt;Development&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#"&gt;Our Work&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;  
  &lt;div id="bodycontainer"&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS File mainpage.css</p>
  
  <pre><code>@charset "UTF-8";
  /* CSS Document */
  html, body {
  margin: 0;
  padding: 0;
  }
  body
  {
  background: #000000;
  font-family: Georgia, Serif;
  white-space:nowrap;
  }
  
  #topnavcontainer
  {
  height:5em;
  background-color:#0f0f0f;
  background-image: url(Images/crosshatch.png);
  }
  
  #navlist li
  {
  display: inline-block;
  list-style-type: none;
  padding-right: 20px;    
  }
  
  #navlist a:link, a:visited, a:hover, a:active
  {
  color:white;
  list-style:none;
  text-decoration:none;
  
  }
  </code></pre>