ページのスクロールバーを削除するにはどうすればよいですか？

私はこれに対する答えが簡単だと知っていますが、3つのdivs-header、map_canvas、およびサイドバーを持つかなり単純なHTMLページがあります。私はいくつかCSSを持って、これをすべてどこに置く必要があるのでしょうか。しかし何らかの理由で私はブラウザのウィンドウでスクロールバーを取得していますが、私はそれらを望んでいません、私はちょうどウィンドウの高さと幅にうまく収まるようにしたいのです。どんな助けでも大歓迎です。ページのスクロールバーを削除するにはどうすればよいですか？

マイページは、このHTMLで構成されています

<!doctype html> 
<html> 
    <head> 
     <title>CSS Exercise</title> 
     <link rel="stylesheet" href="css/style.css" /> 
     <script src="js/script.js"></script> 
    </head> 
    <body onload="initialize()"> 
     <div class="header"></div> 
     <div id="map_canvas"></div> 
     <div class="sidebar"> 
      <input id="lat" type="text" /> 
      <input id="lng" type="text" /> 
     </div> 
    </body> 
</html>

そして、このCSS：

body { 
    height: 100%; 
    width: 100%; 
} 

html { 
    height: 100%; 
} 

.header { 
    width: 100%; 
} 

#logo { 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    margin-bottom: 8px; 
} 

.sidebar { 
    float: right; 
    width: 20%; 
    height: 100%; 
    text-align: center; 
} 

#map_canvas { 
    float: left; 
    width: 80%; 
    height: 100%; 
}

JSFiddle link

出典

2012-05-10 Gady