使屏幕高度達到屏幕的100％

我一直在閱讀所有100％div高度的討論，但我找不到一個簡單的解決方案。如何讓我的div佔據屏幕的所有垂直高度？使屏幕高度達到屏幕的100％

這裏是我的代碼：

CSS

#mother { 
    width: 100%; 
    margin: 0 auto; 
    z-index: 1; 
} 
#stripe_wrap { 
    width: 1053px; 
    min-height: 500px; 
    margin: 0 auto; 
    background: lime; 
} 
#stripe1 { 
    width: 39px; 
    min-height: 500px; 
    margin: 0px 0px 0px 0px; 
    background: #000; 
    float: left; 
} 
#stripe2 { 
    width: 39px; 
    min-height: 500px; 
    margin: 0px 0px 0px 0px; 
    background:#000; 
    float: right; 
}

HTML

<div id="mother" style="overflow-x: hidden;"> 
    <div id="stripe_wrap"> 

     <div id="stripe1"></div> 
     <div id="stripe2"></div> 

    </div> 
</div>

來源

2010-11-25 Erik

而......問題是什麼？ – 2010-11-25 18:55:17

您必須製作高度爲100％的<body>標記，否則將垂直截取以適合內容。

此外請確保將<body>的邊距設置爲0px，否則它將成爲100％_of_visible_area +邊距，從而產生垂直滾動條。

來源

2010-11-25 19:07:59 Teekin

html, body {padding: 0px; margin: 0px; height: 100%;}

http://jsfiddle.net/kEv8F/ - 我的版本。

http://jsfiddle.net/kEv8F/ - 您的版本。

這是你的意思嗎？

來源

2010-11-25 19:05:21 Gazler

嘗試爲您的<body>和<html>設置height:100%。
如果除了這個div在你的頁面上沒有任何東西，100％的高度將是0px沒有這些設置。

來源

2013-04-19 07:45:21

使屏幕高度達到屏幕的100％

回答

相關問題