1209075 - Show when a css property is "logically" overridden by another property

Status: RESOLVED DUPLICATE of bug 1306054

(DevTools :: Inspector, enhancement, P2)

Description

[Patrick Brosset <:pbro>]

Here's one example:

.container {
  display: flex;
}
.item {
  flex: 100px 1 0;
  width: 200px;
  float: left;
}

.item elements do not float, and are not 200px wide, that's because they are part of a flexbox layout and as such, some properties get logically overridden by that.
It would be nice if the rule-view somehow showed this.
Maybe a /!\ icon next to these properties, with a tooltip that explains what happened.

Comment 1

[Brian Grinstead [:bgrins]]

Is there a list of such properties that we could retrieve from the platform?

Comment 2

[Brian Grinstead [:bgrins]]

Or maybe we could pull these out of the specification somehow

Comment 3

[Julian Descottes [:jdescottes]]

Inspector bug triage. Filter on CLIMBING SHOES.