Blog

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, 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 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;` 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: 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 the ones far below the fold to not load until a visitor scrolls near them.

A developer is confusing margin and padding while debugging a layout and wants a quick way to remember which is which. Which correctly distinguishes the two?

Fourth Panel Comics used to space out flex items with `margin-right` on every item except the last, and now wants to switch to the `gap` property instead. What does `gap` do differently?

A user with low vision increases their browser’s default font size to make text easier to read. A site’s padding is declared in rem units. What happens to that padding as a result?

Anchor Point Law Firm’s developer isn’t sure whether `justify-content` should be written on the flex container itself or on each individual flex item inside it. Where does it actually belong?