- Advanced and compound CSS selectors pose difficult to resolve errors for students learning web development.
- In particular, novices don’t know that certain selectors take precedence over others, let alone that there is CSS selector specificity (essentially a weighting system that determines which CSS rule is applied by the browser).
- For example,
.divhas a greater specificity than#element
- For example,
- In particular, novices don’t know that certain selectors take precedence over others, let alone that there is CSS selector specificity (essentially a weighting system that determines which CSS rule is applied by the browser).
- This type of error is called a knowledge-based error. It occurs as a result of significant gaps in knowledge. Resolving these types of errors successful involves substantial learning.
- Note from CSTeachingTips Team: to learn more about CSS Selector Specificity, check out Smashing Magazine’s article CSS Specificity: Things you Should Know.