A developer needs to choose between em and rem for padding on a deeply nested element, where several ancestor elements each have their own font-size declared. What’s a key practical difference to be aware of?

A community theater’s nav has clear :hover styles but no :focus styles at all. A visitor navigating by keyboard (Tab key) reports they can’t tell which link is currently selected. What’s the accurate diagnosis?

Stonewell Museum’s exhibit catalog numbers its major sections using capital roman numerals — I, II, III — instead of ordinary numbers. Which list-style-type value matches this?

Peak Season Travel Agency’s designer wants a headline to be a specific serif typeface, sized larger than body text, in a medium-heavy weight, and colored in the brand’s navy blue — four distinct visual traits controlled independently. Which four CSS properties map to these traits, respectively?

A student wants to prototype a website’s layout in the browser without installing anything, and doesn’t mind starting on a free plan.

Meridian Realty Group’s flex container wraps its items onto three separate rows. The developer wants to control the vertical spacing between those three rows as a group, not the alignment of items within any single row. Which property is built for that?

A team applies the same `rgba(0, 0, 0, 0.4)` overlay to two sections of a page — one with a white background and one with a black background — and is confused that they look different in a screenshot.

A company logo needs to display crisply at both a tiny favicon size and a huge banner size without keeping multiple separate image files.

A designer wants to add breathing room between a card’s text content and the card’s own visible border, without changing how far the card sits from other elements on the page. Which property is designed for that?

A used bookstore’s nav has short link labels like “Buy” and “Sell” that are hard for visitors to click accurately on mobile. Without changing the wording, what CSS approach addresses the click-target size?