力div的嵌套有最小高度的100%?(Force nested divs to have min-h

2019-07-30 22:48发布

我知道, min-height: 100%只会工作,占用最少的父元素的高度的100%,如果父元素具有高度的一些数值,但如果我有几个嵌套的div,我想他们都有100%的最小高度? 我试图min-height:inherit ,但没有任何工作? 我知道我只需勾选上文档加载浏览器的高度值,然后分配给我的嵌套的div,为最小-height属性可能解决这个问题用JavaScript,但我想知道是否有可能解决这一只用CSS?

编辑 :我还想说,我需要我的最外层的div我嵌套的div都具有100%,使得他们采取了浏览器的至少高度的最小高度,但如果需要扩大。

Answer 1:

min-height: inherit; 应工作: http://jsfiddle.net/ugxbs/

编辑

至于百分比值和预期的行为,有后面嵌套最小高度没有逻辑。 你应该做的是使用height属性对所有的父母,然后最小高度添加到最内层DIV

F.ex:

<html>
    <body>
        <div class="outer">
            <div class="inner"></div>
        </div>
    </body>
</html>

CSS:

html, body, .outer { height: 100% }
.inner { min-height: 100%; }

http://jsfiddle.net/4PsdT/

这样一来,你告诉浏览器从顶部(所有外元素设置HTML ),以100%的高度。 这将使这些要素跨浏览器的高度伸展。 然后,只需添加一个min-height ,以包含内容最内部元件。

设置一个height并不意味着它是孩子们的含量过多,就会掉出来,除非你添加overflow:hidden;



Answer 2:

我可以把它与物业高度,但不是最小高度工作。

http://jsfiddle.net/zDVqm/



文章来源: Force nested divs to have min-height of 100%?