您缺少逗号。

Question

简单设置：

父母是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提供响应高度？难道这不起作用吗？我在铁轨上使用红宝石，这可能是为什么？

我有标准的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;

这是可取的，为什么这是我能使这个工作的唯一方法。

Answer 1

原文问题：

enter image description here 您有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;
}

CSS响应高度失败

1 个答案:

您缺少逗号。