The cascade and specificity, flexbox and grid, stacking contexts, and responsive strategy.
4 questions in Frontend Engineering.
Flex items default to min-width: auto, which stops them shrinking below their min-content width, and an unbroken URL makes that width the whole URL. flex-shrink only shares out space above that floor. Set min-width: 0 on the item and give the text a break point with overflow-wrap: anywhere; in grid, use minmax(0, 1fr).
The CSS cascade is the algorithm that picks one winning declaration per property per element: origin and importance first, then cascade layers, then specificity, then source order. Inheritance only fills in when nothing wins, which is why a rule on the parent never beats a declaration on the child.
Flexbox distributes items along one axis and lets content decide the sizes; grid defines tracks up front and places items into them, aligning in both axes. z-index looks broken because it only orders siblings inside one stacking context, and ordinary properties like transform and opacity create new ones. It also connects css grid to the point an interviewer is testing.
A transform, filter, perspective or containment on an ancestor makes that ancestor the containing block for fixed-position descendants, so the header is now positioned and clipped relative to the wrapper instead of the viewport. Use this CSS answer to show the decision, trade-off, and evidence rather than a memorised definition. It also connects positioning to the point an interviewer is testing.