title: White Space Issue using percentage
body: <p>I am newbie to CSS while designing one page 
  CSS</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>  
       body {width:100%;height:920px;margin:0;list-style:none;padding:0;}
      .side{background-color:#9966FF; width:20%;height:920px;float:left;}
      .main{background-color:#CCFFFF; width:80%;height:920px;}
      </code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;body&gt;
      &lt;div class="side"&gt;Its side bar&lt;/div&gt;
      &lt;div class="main"&gt;ites center bar&lt;/div&gt;
      &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>But its giving me some white space after the main class so what my understanding is if I am giving body as 100% it will divide that space in 20% and 80% in .side and .main class please correct me?</p>