Use rem for layout units

[enyo]

I think it would be better to use rem like tailwind does for layout size definitions as well. If all sizes are based on rem then the user can change the default font size and the layout of the page will not break.

If you're open to the idea I can create a PR.

Thanks for this excellent library!

[madeleineostoja]

Hey, not using rem for everything other than font was a conscious decision. All browsers fully support UI scaling without rem, except for the user specified base font size, which is why the font scale is in rem.

It would be really unintuitive if the entire layout scale changed if you had a different base font size for a project. There have been several discussions on the tailwind repo to undo that design decision, and it was only decided against because it would be too much of a breaking change for them.

So gonna flag this one as wontfix, but v open to further discussion!

[enyo]

Thanks for your detailed reply @madeleineostoja . That's interesting. I always found that this was an interesting topic since, as you said, scaling the UI is supported by all browsers, so why would you change the base font size. I guess, the question then is, why it's possible to change the default font size in the first place.

If you have a good article on that subject I'd be very interested!

[madeleineostoja]

Users can still change their base font size in the browser independently of UI scaling, which is why rem is still important for font sizes. And browsers didn’t used to all support full UI scaling, which is why using rem for all the things was a prominent best practice for so long. Now it’s largely an anti-pattern imo. If a user changes their base font size they prob don’t want the entire UI to scale, and moreover for a css library the units provided shouldn’t be relative to a font size, especially for embedded contexts (eg: widgets)