身高未填充100％頁高

我無法弄清楚這一點。我有一個簡單的div集合，包含標題，邊欄和內容區域。標題爲全寬，側面和內容向左浮動。身高未填充100％頁高

我需要側邊欄（用於背景）填充頁面高度的100％，但是當我檢查鉻中的元素時，<body>實際上是在頁面底部之前很久才結束，這似乎是限制高度我的側邊欄。

什麼使<body>無法填滿整頁？

<body> 
    <div id="head"> 
    </div> 
<div id="sidebar"> 
    <div> 
     <div id="menu"> 
      <ul> 
       <li><a href="/dashboard.php"><img src="/img/blank.png" alt="home" id="home_ico">Home</a> 
       </li> 
       <li class="admin"><a><img src="/img/blank.png" alt="home" id="users_ico">Users</a> 
        <ul class="submenu" style="display: none;"> 
         <li><a href="/users">Manage users</a></li> 
         <li><a href="https://stackoverflow.com/users/add.php">Add a user</a></li> 
        </ul> 
       </li> 

       <li class=""><a><img src="/img/blank.png" alt="home" id="clients_ico">Clients</a> 
        <ul class="submenu" style="display: none;"> 
         <li><a href="/client_orgs">Manage clients</a></li> 
         <li><a href="/client_orgs/add.php" class="admin">Add a client</a></li> 
        </ul> 
       </li> 


       <li class=""><a><img src="/img/blank.png" alt="home" id="projects_ico">Projects</a> 
        <ul class="submenu" style="display: none;"> 
         <li><a href="/projects">Manage projects</a></li> 
         <li><a href="/projects/add.php" class="admin">Create a project</a></li> 
         <li></li> 
         <li><a href="/projects/submitted.php" class="admin client">Submitted projects</a></li> 
         <li><a href="/projects/closed.php" class="admin">Closed projects</a></li> 
        </ul> 
       </li> 
       <li class=""><a href="/my_account"><img src="/img/blank.png" alt="home" id="account_ico">Account</a> 
       </li> 
       <li class="active"><a href="/help.php"><img src="/img/blank.png" alt="help" id="help_ico">Help</a> 
       </li> 
      </ul> 

     </div> 
    </div> 
</div>  
<div id="body" class="full"> 
    <div id="content"> 

    <!--start block--> 
    <div class="block"> 
     <h1><img src="/img/blank.png" alt="home" id="help_ico"> Help</h1> 
     <p> 
     Curabitur blandit tempus porttitor. Cras mattis consectetur purus sit amet fermentum. Cras mattis consectetur purus sit amet fermentum. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Maecenas sed diam eget risus varius blandit sit amet non magna. 
     </p> 
    </div> 
</div> 
</body>

CSS：

* { 
    margin:0; 
    padding:0; 
} 
html, body { 
    height:100%; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    line-height: 160%; 
    position: relative; 
    background: #000; 
} 
#sidebar{ 
    width: 200px; 
    background: #000; 
    height: 100%; 
    padding-top: 30px; 
    -webkit-box-shadow: inset -4px 0px 8px 0px rgba(0, 0, 0, 0.5); 
     box-shadow: inset -4px 0px 8px 0px rgba(0, 0, 0, 0.5); 
    float: left; 
} 
#body{ 
    float: left; 
    padding: 30px 0 30px 40px; 
    width: 75%; 
}

來源

2012-11-11 TH1981

推薦？ http://stackoverflow.com/questions/1622027/percentage-height-html-5-css – javanut13