我有一个奇怪而奇怪的问题.问题是一个小问题,我想将最小高度设置为100%,即页面内容应该跨越用户的整个屏幕,如果可能,页面应该在内容超过100%时向下延伸.一个简单的方法是设置min-height:100%并设置height:auto这正是我想要的但是无论我多少次尝试它,问题仍然存在.
我使用高度自动和最小高度:所有元素都是100%,但它不起作用.如果我删除最小高度只包括高度:100%那么它就像一个魅力,但是当内容较大时它会溢出整个页脚.
请帮帮我这里是css:
html,body,container,row,col-lg-3,col-lg-9 { min-height: 100%; height: auto !important; height: 100%; } .container { max-width: 1170px; min-height: 100%; height: auto !important; height: 100%; } .col-lg-3 { min-height:100%; height:100%; } .col-lg-9 { min-height: 100%; height: 100%; }
解决方法
是的,这是一种痛苦,但它是如何工作的.高度可以从定位的父项继承,但不能在具有最小高度属性时继承.
最小高度设置为100%的元素的子元素不能通过百分比继承其父级的高度…
https://stackoverflow.com/a/8468131/1491212
CSS2.1规范:
The percentage is calculated with respect to the height of the
generated Box’s containing block. If the height of the containing
block is not specified explicitly (i.e.,it depends on content
height),and this element is not absolutely positioned,the value
computes to ‘auto’.