使屏幕高度达到屏幕的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％

回答

相关问题