title: My website has some empty spacing I can't get rid of
body: <p>I am developing a very simple website and I have encountered an error in the layout. I have a random to the right of my webpage that isn't visible and that you can scroll to and I don't know how to get rid of it. There really isn't anything going on in my HTMl but here is the CSS of my project.</p>
  
  <pre><code>    @import url(http://nicholastodor.com/sf/usesf.css);
  
  html {
      width: 100%;
      height: 100%;
  }
  
  body {
      background-color: black;
      width: 100%;
      height: 100%;
  }
  
  #developmentTitle {
      margin: auto;
      font-family: "Avenir Next";
      color: lightgrey;
      font-size: 19px;
      vertical-align: middle;
      left: 13%;
      top: 103%;
      position: relative;
      -ms-transform: translate(0,-100%); /* IE 9 */
      -webkit-transform: translate(0,-100%); /* Safari */
      transform: translate(0,-100%);
  }
  
  #development {
      margin: auto;
      font-family: "Avenir Next";
      color: lightgrey;
      font-size: 15px;
      vertical-align: middle;
      left: 33%;
      top: 114%;
      position: relative;
      -ms-transform: translate(0,-116%); /* IE 9 */
      -webkit-transform: translate(0,-116%); /* Safari */
      transform: translate(0,-116%);  
  }
  
  #aboutMe {
      margin: auto;
      font-family: "Avenir Next";
      color: lightgrey;
      font-size: 15px;
      vertical-align: middle;
      left: 33%;
      top: 117%;
      position: relative;
      -ms-transform: translate(0,-116%); /* IE 9 */
      -webkit-transform: translate(0,-116%); /* Safari */
      transform: translate(0,-116%);  
  }
  
  #aboutMeTitle {
      margin: auto;
      font-family: "Avenir Next";
      color: lightgrey;
      font-size: 19px;
      vertical-align: middle;
      left: 13%;
      top: 100%;
      position: relative;
      -ms-transform: translate(0,-100%); /* IE 9 */
      -webkit-transform: translate(0,-100%); /* Safari */
      transform: translate(0,-100%);
  }
  
  #beginningTitle {
      margin: auto;
      font-family: "Avenir";
      color: lightgrey;
      font-size: 24px;
      text-align: center;
      vertical-align: middle;
      top: 50%;
      position: relative;
      -ms-transform: translate(0,-50%); /* IE 9 */
      -webkit-transform: translate(0,-50%); /* Safari */
      transform: translate(0,-50%);
  }
  </code></pre>