One element of responsive web design that can be tricky to solve for is typography. Ideally you want to have type that’s as fluid as possible across different viewports. A conventional way of doing this might be to start with a base font size and then change it when you hit a specific breakpoint: p { font-size: 1em; } @media screen and (max-width: 45em) { p { font-size: 1.25em; } } Here the font s
![Flexible type with :root - Matt Smith](https://cdn-ak-scissors.b.st-hatena.com/image/square/a500e7070afb8b6c4445ac088062151d03923cc0/height=288;version=1;width=512/https%3A%2F%2Fallthingssmitty.com%2Fimg%2Fposts%2Fsunset-home-office-min.jpg)