Consider the following page:
div {
background-color: gray;
background: pink;
}
p {
background: pink;
background-color: gray;
}
...
<div> hello
<p> world
What are the background colors of the dividing box and of the paragraph? Pink and then gray. Instead of using the most specific declaration in a set of declarations, the last applicable one is used. The *only* time I would have thought that would happen is if there were conflicting most-specific definitions. But no, specificity is only a notion applied to selectors, not extended to describe what they're assigning. Now I need to back-pedal and propagate lexical positions of declarations (in theory... not a priority). Not as bad as dealing with hoisting in JavaScript, but another one of those gotchas.
I'm finding a lot of these little things. They're not earth shattering, and seem mostly due to inertia. However, especially when I'm dealing with actual layout rules, stuff is often flat out undefined -- though these points of ambiguity might also be an opportunity (e.g., pick a normative definition that facilitates parallelism ;-)).
No comments:
Post a Comment