How do I get my navigation bar to cover the whole page?
<p>I am fairly new to this kind of stuff. I just want my nav bar to cover the page from side to side instead of having the white spaces on both sides and the top. </p>

<p>Here is my CSS</p>

<pre><code>nav ul {list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #3E3F43;}

nav li {float: left;}

nav li a {display: block;
       color: white;
   text-align: center;
   padding: 14px 16px;
   text-decoration: none;}

li a:hover{background-color: #7559A6;}


Here is my HTML

&lt;nav&gt;

    &lt;ul&gt;
        &lt;li&gt;&lt;a href="home.html" class="active"&gt;Home&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="about.html"&gt;About&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="resume.html"&gt;Resume&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="blog.html"&gt;Blog&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="contact.html"&gt;Contact&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;

&lt;/nav&gt;
</code></pre>