讓一個div全屏像背景

Question

我有以下幾點： http://jsfiddle.net/B6dFk/embedded/result/

摘錄：

HTML：

<div id="aboutback"> 
    This is a background 
</div> 
<div id="workback"> 
    This is another background 
</div> 

<div id="wrapper"> 

<div id="innerwrapper"> 

<div id="nav"> 
    <div id="about" class="menu1"> 
    <p>About</p> 
    </div> 

<div id="aboutsub"> 
    <div id="team" class="menu2"> 
    <p>Team</p> 
    </div> 
    <div id="experience" class="menu2"> 
    <p>Experience</p> 
    </div> 
    <div id="difference" class="menu2"> 
    <p>Difference</p> 
    </div> 
</div> 

    <div id="work" class="menu1"> 
    <p>Work</p> 
    </div> 

<div id="worksub"> 
    <div id="services" class="menu2"> 
    <p>Services</p> 
    </div> 
    <div id="ourprocess" class="menu2"> 
    <p>Our Process</p> 
    </div> 
</div> 

    <div id="portfolio" class="menu1"> 
    <p>Portfolio</p> 
    </div> 
    <div id="contact" class="menu1"> 
    <p>Contact</p> 
    </div> 
</div> 

<div id="outerviewer"> 
    <div id="innerviewer"> 

<p> 
Filler 
</p> 

    </div> 
</div> 
</div> 

CSS

#aboutback 
{ 
    position: absolute; 
    background: #11ac92; 
    min-height: 100%; 
    width: 100%; 
    top: 0; 
    z-index: -1; 
} 

我想#aboutback和#workback佔用全部ba ckground在任何時候。這些將在他們的圖像，我將使用jQuery的動畫。

問題是，當窗口不是整頁（所以滾動條出現），你向下滾動，你會看到絕望的白色虛無。

值得注意的是我已經嘗試設置body標記的位置，它改變了效果但沒有修復它。例如，position:absolute;會將所有內容都推向左側並在右側留出空白區域。

任何簡單的解決方案，請？

Answer 1

body{ 
    height:100%; 
    overflow:hidden; 
} 

Answer 2

html{height:100%;} 

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