为什么我的CSS会覆盖？

Question

这应该是非常基本的，我想我现在已经知道了。但显然我错过了一些东西。

在第4859行，我有以下css：

.ui-panel-wrapper {
  position: relative;
  min-height: inherit;
  border: 0;
  overflow-x: hidden;
  z-index: 999;
}

在第5643行我有以下css：

.ui-panel-wrapper {
  min-height: auto !important;
}

但输出是这样的：

为什么我的最后一句话不能覆盖第一个陈述？

Answer 1

规则旁边的警告符号表示它被忽略，因为它无效，而不是因为它被覆盖。将鼠标悬停在其上可查看特定消息。

正如其他许多人所指出的那样，您需要的价值是0，而不是auto。

Answer 2

使用min-height:0;代替min-height:auto;

auto是无效值。

Answer 3

MDN shows that it's a valid value，因为它在Firefox中受支持，但在其他任何不受支持的地方都会被忽略。您在Chrome中收到警告（这就是为什么会被忽略），但您不会在Firefox中收到相同的警告。

Answer 4

＆＃34;自动＆＃34;不是min-height属性的可接受值。它适用于高度，但不适用于最小高度。它被覆盖因为它无效。

http://www.w3schools.com/cssref/pr_dim_min-height.asp

使用0或者初始值。

Answer 5

记录中，这是官方specification

  

<强> '最小高度'

     

价值：<length> | <percentage> | inherit

     

初始：0

非常具有讽刺意味的是，W3Schools认为W3School正确地通过了MDN。