Brad Frost's blog is a go-to resource for web designers and developers seeking guidance on responsive web design and front-end development. With a focus on creating adaptable and user-friendly web experiences, Brad shares practical tips, design patterns, and development strategies. From building responsive layouts to optimizing performance, developers can learn  techniques to enhance their web projects.

Brad Frost

A rare use case for em units in typography design, specifically for text-decoration-offset.

A rare use case for em units

Are <code>em</code>s really that rare? I use them all the time to set sizes that scale with their associated text.
For example, if I set <code>font-size</code> of a button to <code>2rem</code>, then I’ll do all padding and border-radius etc with <code>em</code>. If I then later create a <code>.small</code> variant of the button, I only need to adjust the font-size to let’s say <code>1rem</code> and everything else scales properly.

nothing is “rare” here. I’ve been using <code>em</code> sizing units since their inception on many projects. for me using <code>rem</code> is rare and makes no sense because inheritance is lost.

didn’t know that was a thing. Thanks!