A flower shop wants its nav’s hover-triggered background color change to feel smooth rather than sudden. Which property, applied to the link’s background-color, achieves that per the deck’s example?
Author: Anonymous
Aperture Photography Studio’s designer wants three side-by-s…
Aperture Photography Studio’s designer wants three side-by-side promotional panels — pricing, portfolio link, and contact info — arranged next to each other. A teammate suggests putting them in one table row as three cells. Why is CSS Grid or Flexbox generally the better fit here?
Detail Dynamics Car Care’s toolbar has a logo icon and a set…
Detail Dynamics Car Care’s toolbar has a logo icon and a settings icon inside a `display: flex;` container, and needs the logo flush to the far left, the settings icon flush to the far right, with even space between them. Which `justify-content` value does exactly that?
A developer has written padding-top: 10px, padding-right: 10…
A developer has written padding-top: 10px, padding-right: 10px, padding-bottom: 10px, and padding-left: 10px as four separate declarations on the same element, and wants to condense them into one line using shorthand. What single declaration is equivalent?
Willow Creek Wellness Spa wants its body paragraphs to look…
Willow Creek Wellness Spa wants its body paragraphs to look slightly lighter than the normal 400 weight, using a value like 320, on a variable font. Why does this work with a variable font when it might not with a traditional one?
Meridian Realty Group has a three-column layout — a sidebar,…
Meridian Realty Group has a three-column layout — a sidebar, a main content area, and an ad panel — with the sidebar and ad panel set to `flex-grow: 0;` and the main content area set to `flex-grow: 1;`. When the browser window is widened, which column absorbs the extra space?
A tattoo parlor’s designer wants nav links where the entire…
A tattoo parlor’s designer wants nav links where the entire button-like box responds to a click, matching what the deck calls essential for navigation usability. Which single change accomplishes this?
Vinyl Vault Record Shop gives three album cards `flex: 1;` i…
Vinyl Vault Record Shop gives three album cards `flex: 1;` inside a row container. What does that shorthand expand to, and what’s the visual result?
Harbor View Realty has two different needs on the same site:…
Harbor View Realty has two different needs on the same site: a table comparing square footage and price across five listings, and an overall three-column homepage layout with a sidebar, main content, and ad space. Which need should actually use an HTML table?
A long product page has 40 images, and the developer wants t…
A long product page has 40 images, and the developer wants the ones far below the fold to not load until a visitor scrolls near them.