title: small space keeps showing to right side of my website w
body: <p>I've been having this issue with this webpage I've been working on. Whenever I view the page in google chrome on my mac, I get a sliver of space to the right of page when I scroll to the right. I'm not really sure how to fix the problem. Here's an image to show what I'm talking about, along with my html and css. Thanks in advance to anyone that can help me.</p>
  
  <p>Image:
  <a href="http://imgur.com/0JAZsgg&amp;KcUfJZl&amp;ephxQZC#2" rel="nofollow">http://imgur.com/0JAZsgg&amp;KcUfJZl&amp;ephxQZC#2</a></p>
  
  <p>Here's my html:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="width=device-width"&gt;
      &lt;!--[if lt IE 9]&gt;
      &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
      &lt;![endif]--&gt;
      &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="../scripts/javascript/responsive_drop_down.js"&gt;&lt;/script&gt;
      &lt;link href="../css/main_stylesheet.css" rel="stylesheet" type="text/css" media="screen"/&gt;
      &lt;link href="../css/print_stylesheet.css" rel="stylesheet" type="text/css" media="print"/&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div id="wrapper"&gt;
          &lt;header&gt;
              &lt;h1&gt;This is a placeholder &lt;br /&gt;
                  for header&lt;/h1&gt;
          &lt;/header&gt;
  
          &lt;nav class="nm"&gt;
              &lt;div class="mobilmenu"&gt;&lt;/div&gt;
              &lt;div class="mobile-container"&gt;
                  &lt;ul&gt;
                      &lt;li class="white"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
                      &lt;li class="red"&gt;&lt;a href="#"&gt;Video&lt;/a&gt;&lt;/li&gt;
                      &lt;li class="purple"&gt;&lt;a href="#"&gt;Pictures&lt;/a&gt;&lt;/li&gt;
                      &lt;li class="blue"&gt;&lt;a href="#"&gt;Audio&lt;/a&gt;&lt;/li&gt;
                      &lt;li class="green"&gt;&lt;a href="#"&gt;Other Work&lt;/a&gt;&lt;/li&gt;
                      &lt;li class="yellow"&gt;&lt;a href="#"&gt;About Me&lt;/a&gt;&lt;/li&gt;
                      &lt;li class="gray"&gt;&lt;a href="#"&gt;Contact Me&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;    
          &lt;/nav&gt;
  
          &lt;div class="content-container"&gt;
  
              &lt;article class="content-main"&gt;
                  &lt;section&gt;
                      &lt;h1&gt;Heading goes here...&lt;/h1&gt;
                      &lt;time datetime="#"&gt;Time will go here.&lt;/time&gt;
                      &lt;p&gt;Content will go here...&lt;/p&gt;
                  &lt;/section&gt;
              &lt;/article&gt;
  
              &lt;aside class="sidebar"&gt;
                      &lt;p&gt;More Content to come soon.&lt;/p&gt;
              &lt;/aside&gt;
          &lt;/div&gt;    
  
          &lt;div class="footer-position"&gt;
              &lt;footer&gt;
                  &lt;span class="copyright"&gt;All rights reserved 2014.&lt;/span&gt;
  
                  &lt;nav class="nf"&gt;
                      &lt;ul&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Video&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Pictures&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Audio&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Other Work&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;About Me&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Contact Me&lt;/a&gt;&lt;/li&gt;
                      &lt;/ul&gt;
                    &lt;/nav&gt;
                &lt;/footer&gt;
             &lt;/div&gt;    
         &lt;/div&gt;
     &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Here's the css:</p>
  
  <pre><code>@import url(http://fonts.googleapis.com/css?family=Ubuntu:300,400,300italic,400italic);
  @font-face 
  {
  font-family: 'bebas_neueregular';
  src: url('../font/BebasNeue/bebasneue-webfont.eot');
  src: url('../font/BebasNeue/bebasneue-webfont.eot?#iefix') format('embedded-opentype'), 
       url('../font/BebasNeue/bebasneue-webfont.woff') format('woff'), 
       url('../font/BebasNeue/bebasneue-webfont.ttf') format('truetype'), 
       url('../font/BebasNeue/bebasneue-webfont.svg#bebas_neueregular') format('svg'), 
       url('../font/BebasNeue/BebasNeu.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
  
  }
  
  
  body
  {
  width:100%;
  font-family: 'Ubuntu', sans-serif;
  margin:0;
  padding:0;
  background-color:#84888B;
  overflow-y:scroll;
  direction:ltr;
  display:block;
  }
  
  #wrapper
  {
  display:block;
  width:100%;
  margin:0 auto;
  padding:0 auto;
  }
  
  header
  {
  font-family:'bebas_neueregular', sans-serif;
  background-color:#5D0660;
  color:#E21208;
  text-align:center;
  padding:15px;
  }
  
  nav
  {
  display:block;
  font-family:'bebas_neueregular', sans-serif;
  text-align:center;
  overflow:hidden;
  }
  
  nav ul
  {
  list-style:none;
  }
  
  nav ul li
  {
  display:inline-block;
  }
  
  nav ul li a
  {
  text-decoration:none;
  }
  
  nav.nm
  {
  width:100%;
  background-color:#000000;
  font-size:125%;
  margin:0;
  padding:0;
  }
  
  nav.nm ul
  {
  margin:0 auto;
  margin-top:0;
  }
  
  nav.nm ul li a
  {
  display:block;
  color:#ffffff;
  padding:15px 16px;
  }
  
  nav.nm ul li a:hover
  {
  color:#000000;
  -webkit-transition:450ms ease;
  -moz-transition:450ms ease;
  transition:450ms ease;
  }
  
  nav.nm ul li.white a:hover
  {
  background-color:#ffffff;
  }
  
  nav.nm ul li.red a:hover
  {
  background-color:#E21208;
  }
  
  nav.nm ul li.purple a:hover
  {
  background-color:#9E00A3;
  }
  
  nav.nm ul li.blue a:hover
  {
  background-color:#1A297F;
  }
  
  nav.nm ul li.green a:hover
  {
  background-color:#319032;
  }
  
  nav.nm ul li.yellow a:hover
  {
  background-color:#E1E13D;
  }
  
  nav.nm ul li.gray a:hover
  {
  background-color:#84888B;
  }
  
  nav.nf
  {
  font-size:85%;
  }
  
  nav.nf ul li:last-child 
  {
  border-right:none;
  }
  
  nav.nf ul li 
  {
  border-right:1px solid #000000;
  }
  
  nav.nf ul li a
  {
  display:block;
  padding:2px 9px;
  color:#000000;
  }
  
  nav.nf ul li a:hover
  {
  color:#ffffff;
  }
  
  
  
  footer
  {
  width:100%;
  background-color:#1A297F;
  text-align:center;
  margin-top:38.6%;
  padding:0.2%;
  }
  </code></pre>