CSS

Nest rules in plain CSS, the & selector, nesting media queries, and differences from Sass.

Align nested content to a parent grid with subgrid, and size tracks with min-content, max-content and fit-content.

How teams keep CSS maintainable: naming conventions, utility classes, component scoping and when each fits.

Build palettes and dark mode from a few tokens with color-mix(), relative colour syntax and light-dark().

The rendering pipeline, what triggers layout and paint, and using DevTools to find slow styles.

Animate between page states with the View Transitions API and link animations to scroll position without JavaScript.

Descendant, child and sibling combinators, and selecting by attribute value.

Style states like :hover, :focus-visible and :checked, positions like :nth-child, and generated content with ::before and ::after.

justify-content, align-items, wrapping, and how flex-grow, flex-shrink and flex-basis share space.

Two-dimensional layout with grid-template-columns, rows, the fr unit, gap and placing items.

What CSS does and the three ways to add it to a page: inline, internal and external stylesheets.

Describe page layouts visually with grid-template-areas, and rearrange them at different widths.

How a CSS rule is built, comments, and reading errors in DevTools.

A practical comparison with examples of components and pages that suit each, and how they combine.

Target elements by type, class and ID, group selectors, and why classes are usually the right choice.

How each position value works, containing blocks, and sticky headers and sidebars.

How browsers decide which rule wins, calculating specificity, inherited properties, and why to avoid !important.

Why z-index sometimes does nothing: stacking contexts, what creates them, and how to debug layering.

Every way to write colour in CSS, transparency, and why oklch gives more predictable palettes.

Load custom fonts, avoid invisible text with font-display, self-host versus Google Fonts, and variable font axes.