Silly web element inspector (safari / chrome) question, but I can't seem to figure out why some properties are dimmed.
After looking at it on the link you provided, the faded (dimmed) ones are the style rules that don't have any browser operations linked to them, for example:
Click the little arrow next to background:
you get a list of rules that Chrome uses to interpret your CSS.
On float
and height
, there is pretty much only one way that can be interpreted and so Chrome doesn't need to add any browser specific styles to make it display as intended.
Hope that helps to explain it :)
Faded rules are rules that don't need any special attention from the browser :)
Just a guess - but did you check if it ain't just a way to easily distinguish computed styles?
According to source Webkit inspector apply 50% opacity to css styles that are "inherited" or "implicit", from inspector.css
.styles-section .properties .implicit, .styles-section .properties .inherited {
opacity: 0.5;
}
- Implicit are the one that are under a composite property like
border: 1px solid red
color: red
will be grayer. - Inherit are the ones with the explicit "inherit" value.
Now the current chrome version seem to color gray some other values, too bad the inspector on the inspector is not working anymore :(