In short
CSS sizing units — px (absolute), %, em/rem (relative to font size), vw/vh (viewport) — each suited to different responsive scenarios. Choosing units well makes interfaces more resilient to different font settings, viewport sizes, accessibility preferences, and content lengths.
How to learn this
- 1Rebuild a component using `rem` instead of `px` for scalable typography. Validate your understanding by applying it in a small practical example.
- 2Learn the difference between `em` (relative to parent) and `rem` (relative to root). Focus on understanding the underlying reason it works, not only memorizing the definition.
- 3Try `vw`/`vh` for full-viewport hero sections.
More topics at this stop
Stuck on this topic? Ask an Insider
Get 1:1 guidance from people who've walked this exact path — on the InsideEdge app.
