title: website trying to scroll where there isnt anything
body: <p>my website has a scroll bar that goes quite far over to the right and one that goes down. nothing is displayed in these areas so the scroll bar is unecesary! if anything it could fit all on one page. these creates a lot of white space around my page.</p>
  <p>how can i stop this from happening?</p>
  <pre><code>   &lt;!DOCTYPE html&gt;
  &lt;head&gt;
  &lt;link href='http://fonts.googleapis.com/css?family=Paytone+One' rel='stylesheet' type='text/css'&gt;
  &lt;title&gt;Louis Moore | Creating The Future  &lt;/title&gt;
  &lt;!--[if IE]&gt;
  &lt;link rel=&quot;stylesheet&quot; type&quot;text/css&quot; href=&quot;ie.css&quot; &gt;
  &lt;![endif]--&gt;
  
  &lt;/head&gt;
  &lt;style&gt;
  .box {
  background-color: #F1F2F2;
  border: 1.5px #D1D3D4 solid;
  position: relative;
  top: 100px;
  height:450px;
  width:100%;
  }
  .image1 {
  position: relative;
  top:-100px;
  left: 390px;
  }
  body{
  font-family: 'Paytone One', sans-serif;
  font-size: 30px;
  }
  h1 {
  font-family: 'Paytone One', sans-serif;
  font-size: 40px;
  position: relative;
  top:-250px;
  left: 370px;
  }
  h2 {
  font-family: 'Paytone One', sans-serif;
  font-size: 30px;
  position: relative;
  top:-300px;
  left: 480px;
  color: #FC3B3B;
  }
  h3 {
  font-family: 'Paytone One', sans-serif;
  font-size: 20px;
  position: relative;
  top:-290px;
  left: 390px;
  }
  .image2 {
  position: relative;
  top:-300px;
  left: 590px;
  }
  .box1 {
  width: 100%;
  height: 5px;
  background-color:  #FC3B3B;
  position: relative;
  top:100px;
  left: 0px;
  }
  p {
  position: relative;
  top:150px;
  left: 100px;
  font-size: 15px;
  font-family: arial;
  color: #585858;
  }
  &lt;/style&gt;
  
  
  &lt;body&gt;
  &lt;div class=&quot;box&quot;&gt;
  &lt;img src=&quot;louis.png&quot; class=&quot;image1&quot; alt=&quot;.&quot; width=&quot;400px&quot; height=&quot;400px&quot;&gt;
  &lt;h1&gt; WELCOME TO MY PAGE&lt;/h1&gt; 
  &lt;h2&gt;COMING SOON... &lt;/h2&gt;
  &lt;h3&gt;BUT FOR NOW FOLLOW ME ON TWITTER&lt;/h3&gt;
  &lt;a href=&quot;http://twitter.com/louismoore18&quot;&gt;&lt;img src=&quot;twitter.png&quot; class=&quot;image2&quot; border=&quot;0&quot; alt=&quot;.&quot;&gt;&lt;/a&gt;
  &lt;/div&gt;
  &lt;div class=&quot;box1&quot;&gt;
  
  &lt;/div&gt;
  &lt;p&gt;louismoore.net © All rights reserved 2012&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>EDIT: this is how it should look like
  <img src="https://i.stack.imgur.com/BDul9.png" alt="" /></p>