Chrome 40是否打破了正确内容CSS覆盖？

Question

我注意到今天的Chrome 40更新justify-content 似乎没有得到后续样式声明的正确覆盖.

看一下这个小提琴的例子:

  <div class="flex-parent">
    <div class="flex-child"></div>
    <div class="flex-child"></div>
  </div>

和

.flex-parent {
  display: flex;
  position: absolute;
  top: 0; right: 0; left: 0;

  /*
     IT SHOULD BE POSSIBLE TO SAFELY REMOVE
     THESE TWO LINES BECAUSE THEY ARE OVERRIDEN:
  */
  background: yellow;
  justify-content: center;
}

.flex-parent {
  /* Overriding background: it works! */
  background: green;

  /* Overriding justify-content: NOPE ;-( */
  justify-content: space-between;
}


.flex-child {
  width: 50px;
  height: 50px;
  margin: 10px;
  background: skyblue;
}

Firefox(覆盖工作):

Chrome 40(覆盖似乎被打破):

我的假设是正确的,还是我误解了CSS？请注意,这与前缀无关:Chrome支持无前缀justify-content,如果不起作用,则在第一个选择器中注释掉规则时没有任何区别.

更新:提交为https://code.google.com/p/chromium/issues/detail?id=451387

Answer 1

您对级联的理解完全正确.如果您查看Web Inspector,您将看到justify-content: center声明被删除,但只有当您取消选中它时(以与评论它类似的方式),您才能让Chrome忽略它.

也许他们在Chrome 39和40之间的变化中意外地破坏了一些东西,因为他们有一种非常烦人的习惯,但我不知道是什么.

从rwacarter链接的问题来看,显然他们用级联解析代码做了一些时髦的事情,以适应Flexbox规范的某些变化,这似乎是导致这种情况的原因.同样,我并没有声称理解他们这样做的原因,但他们似乎习惯于在这里和那里重写事物,导致整个地方出现回归.好的东西Chrome处于常绿的快速释放周期,是吗？