Modern CSS

Modern CSS interviews cover runtime theming, internationalization-friendly properties, capability-aware media features, motion, relational selectors, and explicit cascade layers.

Subtopics: custom properties, logical properties, media queries, animations and transitions, :has, and @layer.

On interviews: explain custom properties versus preprocessor variables, RTL-safe spacing, prefers-reduced-motion, and when :has replaces JavaScript.

Common pitfalls: undefined CSS variables invalidating declarations, mixing physical and logical properties, and broad :has selectors that are hard to maintain.

Checklist:

• Use semantic custom properties with fallbacks.
• Prefer logical properties for i18n-ready components.
• Respect user preference media features.
• Organize layers before specificity fights.