Html Div 100%高度显示为0px？

我目前正在建立一个网站，有一个小问题，我似乎无法解决，我创建了一个高度为100%的div，在该div内是一个高度为100%的滑块div，问题是第一个div显示的高度为0px，因此滑块div下方的div显示在滑块div后面，有人能帮我吗

这是我的密码：

.slider-container {
    width:                              100%;
    min-height:                         100%;
    background-color:                   white;
    float:                              left;
}

.main-content {
    width:                              100%;
    height:                             1000px;
    background-color:                   pink;
    float:                              left;
}

.column {
    width:                              31%;
    height:                             auto;
    background-color:                   orange;
    float:                              left
}

/* SLIDER */

.caption {
    width:                              500px;
    background-image:                   url("..//img/caption-bg.png");
    background-size:                    100%;
    position:                           absolute;
    z-index:                            99;
    overflow:                           hidden;
    margin-top:                         7%;
    margin-left:                        5%;
    -moz-border-radius:                 20px;
    border-radius:                      20px;
}

.caption-text {
    max-width:                          460px;
    overflow:                           hidden;
    margin:                             20px;
}

.wrapper .slider-container #slideshow { 
    position:                           relative; 
    width:                              100%;
    float:                              left;
}

.wrapper .slider-container #slideshow > div { 
    position:                           absolute; 
}

滑块容器div应具有100%的高度，以便主内容div位于其下方

---

提前感谢您的支持

试着给以下各项设定一个高度：

html, body {
    width:100%;
    position:relative;
}

---

%

单位始终与某个值相关。。即使您已指定高度：100%上，您会注意到它最终是0px高，就像您为其指定100%高度的所有

一样，因为这些值是相对于其父容器的，而父容器最终是根

元素，当前没有明确的高度设置，因此它默认为

自动

。如果给根元素

高度：100%您将获得预期的行为
试试这个

    <style type="text/css">
html {
    height: 100%;
}

body {
    text-align: center;
    height: 100%; 
}

        </style>


html{
身高：100%；
}
身体{
文本对齐：居中；
身高：100%；
}
在某种程度上，这个100%s的级联需要有一个具有显式高度的祖先。滑块应该是动态的，以便其fluidFor
。滑块容器
要具有%高度，您需要给其父级一个显式高度，例如500px。否则，说100%是没有意义的，因为引擎不知道它的价值应该占多少百分比。这里有一个链接到该网站，这样你就可以看到哪里出了问题，但是当它的高度（例如500px）时，布局怎么可能是流畅的？我想我理解你的意思，在这种情况下，slider容器div的高度为100%，但不清楚100%是什么，但是当我给html 100%高度时，什么也没有改变？这确实改变了一些东西，但现在slider和content div之间有一个很大的差距。去掉
min height:100%在滑块容器上不同浏览器中的间隙也不同，因为您尚未清除浮动。。您将内容区域和滑块向左浮动，但没有清除它们，因此它们仍不在页面流中。因此，为什么正文和html高度不包括内容区域，即使它是100%