[All skill tests](https://jobicy.com/tests.md) Skill assessment # CSS Cascade Layers and Specificity Resolution Skills Test Assess how CSS declarations compete through origin, importance, cascade layers, specificity, scope proximity, and source order. The test focuses on predicting and controlling the declaration that styles an element. [Start the test](#test-start) Share Assessment setup Ready ## Choose the level that matches your current experience. * 01 Basic Available * 02 Intermediate Available * 03 Advanced Available Instant result Review your score after submission 20–30 Questions per assessment 15–45 min Estimated completion time 3 levels Choose your difficulty CSS [View category](https://jobicy.com/test-category/css-proficiency.md) Start assessment ## Choose your level and begin. Answer without outside help so the result reflects your current knowledge. You will see your score after completing the selected assessment. Reliable CSS maintenance depends on understanding why one declaration wins over another. Cascade layers and specificity let teams organize third-party styles, component rules, utilities, and overrides without escalating selectors or relying on frequent !important declarations. Basic Intermediate Advanced This is a demo version of the test. You may attempt up to 3 questions. To take the full test and save your results, please [log in](https://jobicy.com/dashboard-page.md) or [create an account](https://jobicy.com/dashboard-page#tab2.md). This is a demo version of the test. You may attempt up to 3 questions. To take the full test and save your results, please [log in](https://jobicy.com/dashboard-page.md) or [create an account](https://jobicy.com/dashboard-page#tab2.md). This is a demo version of the test. You may attempt up to 3 questions. To take the full test and save your results, please [log in](https://jobicy.com/dashboard-page.md) or [create an account](https://jobicy.com/dashboard-page#tab2.md). Test details ## Know what to expect. Review the instructions, covered skills, example question themes, and intended audience before beginning. 01 ### Instructions and covered skills Read each code sample carefully before selecting an answer. Focus on the declarations that actually match the referenced element. Consider importance, origin, layer order, specificity, scope proximity, and source order in that sequence. Keep browser notifications and unrelated tabs closed while working. Do not infer behavior from class names alone; use the CSS rules shown. Choose the option that most directly explains the resulting style or the appropriate change. Review each selection before submitting your responses. ### Key Areas This test evaluates the ability to predict and deliberately control CSS cascade outcomes in production stylesheets. Candidates work with author declarations, normal and important declarations, named cascade layers, unlayered rules, selector specificity, source order, and scoped styles. They should understand that layer precedence is decided before specificity for declarations within the same origin and importance category. They should also recognize the different ordering applied to important declarations, where earlier layers take precedence over later layers and unlayered important declarations rank below layered important declarations. Selector analysis includes IDs, classes, attributes, type selectors, pseudo-classes, pseudo-elements, and functional pseudo-classes. Candidates should be able to calculate the effects of :is(), :not(), :has(), and :where(), including the zero specificity contributed by :where(). The test also covers ties resolved by source order and by scoping proximity when matching declarations are in applicable @scope blocks. Questions use realistic component, utility, and vendor-style scenarios rather than isolated selector trivia. ### Recommended Preparation Review the cascade sorting order: relevance, origin and importance, encapsulation context where applicable, style attributes, layers, specificity, scoping proximity, and order of appearance. Practice tracing only the rules that match a target element, then eliminate candidates one cascade criterion at a time. Create small examples with a reset layer, a vendor layer, component styles, and unlayered application overrides. Compare the behavior of normal declarations with declarations marked !important rather than assuming they follow identical layer ordering. Also practice calculating specificity as ID, class-like, and type-like components. Verify functional pseudo-class behavior with short browser experiments, especially when selector lists contain arguments of different weights. Learn to use low-specificity selectors for reusable defaults and reserve stronger selectors for intentional ownership boundaries. Familiarity with browser developer tools, including the Styles and Computed panels, helps validate which declaration wins and why. 02 ### Examples of questions 1. What determines whether a declaration in a later cascade layer can override one in an earlier layer? 2. How does an unlayered author rule compare with a normal declaration inside an author layer? 3. Which selector has greater specificity: .card .title or #panel .title? 4. What effect does :where(.dialog) have on selector specificity? 5. When two matching rules have equal specificity, what normally resolves the tie? 6. How do normal important declarations reverse cascade-layer precedence? 7. What does the :is() function contribute to selector specificity? 8. When can @scope proximity resolve a tie between matching declarations? 9. Why can a selector using :where() be useful in a component stylesheet? 10. Which cascade criterion is evaluated before selector specificity? 03 ### Who this test is best for Frontend developers, UI engineers, design-system contributors, and web professionals who maintain component styles across shared codebases. Related assessments ## Continue with a similar skill test. Explore assessments from the same professional area to compare adjacent skills and build a broader picture of your knowledge. [CSS 3 levelsCSS Custom Properties and Theming Skills TestThis test evaluates your ability to use CSS custom properties (variables) for theming, dynamic updates, and maintainable stylesheets. It covers definition, scope, inheritance,… Open assessment →](https://jobicy.com/tests/css-custom-properties-and-theming-skills-test.md) [CSS 3 levelsCSS Basics Skills Certification TestCSS (Cascading Style Sheets) is one of the three cornerstone languages of the web, together with HTML and JavaScript. It allows web developers… Open assessment →](https://jobicy.com/tests/css-basic.md) [JavaScript 3 levelsJavaScript Event Delegation and DOM Propagation Skills TestAssess your ability to handle browser events through delegation, bubbling, capturing, and propagation control. The test focuses on reliable event handling patterns for… Open assessment →](https://jobicy.com/tests/javascript-event-delegation-and-dom-propagation-skills-test.md) [Tailwind CSS 3 levelsTailwind CSS Variant Composition and State Styling Skills TestThis test evaluates the use of Tailwind CSS variants to style elements according to interaction, parent state, sibling state, attributes, and structural position.… Open assessment →](https://jobicy.com/tests/tailwind-css-variant-composition-and-state-styling-skills-test.md) [Vue.js 3 levelsVue.js Composition API Composables and Dependency Injection Skills TestEvaluate how well you design, consume, and test reusable Vue Composition API logic. The test focuses on composable state, lifecycle handling, dependency injection,… Open assessment →](https://jobicy.com/tests/vue-js-composition-api-composables-and-dependency-injection-skills-test.md) [HTML 3 levelsHTML Semantic Structure and Document Landmarks Skills TestEvaluate how well you select and apply HTML elements that convey meaningful document structure. The test focuses on landmarks, sectioning content, headings, and… Open assessment →](https://jobicy.com/tests/html-semantic-structure-and-document-landmarks-skills-test.md) [Git & Version Control 3 levelsGit Rebase Conflict Resolution and History Recovery Skills TestEvaluate how well you can rebase feature work, resolve conflicts, recover from unwanted history changes, and coordinate rewritten branches. The test focuses on… Open assessment →](https://jobicy.com/tests/git-rebase-conflict-resolution-and-history-recovery-skills-test.md) [React 3 levelsReact Hooks for State and Side Effects Skills TestEvaluate your proficiency in React Hooks including useState, useEffect, useContext, and more. This test measures your ability to manage state and side effects… Open assessment →](https://jobicy.com/tests/react-hooks-for-state-and-side-effects-skills-test.md) [Git & Version Control 3 levelsGit Branching and Merging Strategies Skills TestEvaluate your proficiency in Git branching and merging, including branch creation, management, merge strategies, and conflict resolution. This test covers essential techniques for… Open assessment →](https://jobicy.com/tests/git-branching-and-merging-strategies-skills-test.md) ## Share the assessment or try another skill. Send this test to a colleague or friend, or return to the assessment library to explore another professional area. Share this test [Browse all tests](https://jobicy.com/tests.md)