When to pick a specific unit

Which unit should the recipe card's width use, and which should its border use? Each unit in this chapter follows one thing: pixels follow nothing, rem follows the reader's default text size, em follows the text around an element, and vw and vh follow the browser window. Choosing a unit therefore means asking one question about each value: what should this length change with?

This lesson answers that question for every value on a finished recipe page, a hero banner with two recipe cards below it.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">