Html min-height 不适用于 body
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3740722/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
min-height does not work with body
提问by Razor Storm
Does min-height not work on body/html?
min-height 对 body/html 不起作用吗?
body, html
{
min-height:100%;
}
Accomplishes absolutely nothing (firebug reports the body,html tags height does not change at all)
完全没有完成(萤火虫报告正文,html 标签高度根本不改变)
回答by Moses
First, declare a doctype so you're in standards if you haven't already.
首先,声明一个文档类型,以便您在标准中(如果您还没有)。
Now, the body can only be as high as the containing html, so you need to set HTML tag to 100% height, and body to min-height 100%. This works for me on Firefox.
现在,body 只能与包含的 html 一样高,因此您需要将 HTML 标签设置为 100% 高度,将 body 设置为 min-height 100%。这在 Firefox 上对我有用。
html {height:100%}
body {min-height:100%}
回答by Guy
This worked for chrome 64 without setting a hard-coded height:
这适用于 chrome 64,无需设置硬编码高度:
html {
min-height: 100%;
display: flex;
}
body {
flex: 1;
}
回答by Zachary
Not all browsers like min-height, try something like this to catch all browsers.
并非所有浏览器都喜欢 min-height,尝试这样的方法来捕获所有浏览器。
min-height:100%;
height:auto !important;
height:100%;
回答by Damjan Pavlica
I solved the problem with just:
我只用以下方法解决了这个问题:
body {
min-height: 100vh;
}
回答by Alina Yi
html{
height:100%;
}
body{
min-height:100%;
position:relative;
}
you must add
你必须添加