Search the blog

To make a font-size respond to the browser width was nigh on impossible before the introduction of the vw unit. This stands for viewport width and each unit is 1% of the browser’s viewport width.

To make responsive font sizes based on browser width simply do something like this:

.font { font-size: 10vw; }
<div class="font">Test</div>
Tim Bennett is a web designer and developer. He has a First Class Honours degree in Computing from Leeds Metropolitan University and currently runs his own one-man web design company, Texelate.