简单设置:
parent 是 HTML 和 BODY 他们的 CSS
html body {
padding: 0px;
margin: 0px;
min-height: 100%;
min-width:100%;
background-color:blue;
}
我希望 div 具有响应高度:
#test {
min-width:100%;
min-height:100%;
background-color: yellow;
}
我应该看到黄色(我想我应该),但我只看到蓝色。很抱歉这个非常基本的问题,我从来没有遇到过这个问题,而且我不知道为什么它才开始发生......
如何为#test 设置响应高度?这不应该工作吗?我在 Rails 上使用 ruby,这可能是原因吗?
我有标准的 application.html.erb,在我看来唯一的 div 是测试。
当然,它在 rails 中,所以我的观点只是
<div id="test"></div>
application.html.erb 看起来像这样
<!DOCTYPE html>
<html>
<head>
<title>FooPartners</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<%= yield %>
</body>
</html>
因此浏览器解释为 html、body、test,然后关闭它们。
更新:我通过将高度更改为
来实现此功能height: 12(orWhatever%)vh;
这是明智的吗,为什么这是我能让它工作的唯一方法。
最佳答案
原始问题:
你有 html body
,它应该是 html, body
语法不正确。
你少了一个逗号。
http://jsbin.com/zizuse/1/edit
http://codepen.io/anon/pen/ghCLH
html, body {
padding: 0px;
margin: 0px;
height: 100%;
background-color:blue;
}
#test {
width:100%;
min-height:100%;
background-color: yellow;
}
关于html - CSS响应高度失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25164410/