Consider using rem units #987

Is your feature request related to a problem? Please describe. This relates to #966

I noticed in most of the SASS files something that should be addressed. font-sizes and other properties with measurement values are set as em, px, %.

Describe the solution you'd like

Consider using rem (and em when necessary). Browsers by default consider 1rem to be 16px on the root element, but if a user has different font settings, that 1rem will be equal to that value. So using rem, everything will be sized based off of the browser's or user's font-size setting. em is also useful when whatever is being sized is dependent on its element's font-size, not the root element's font-size.

There’s a great discussion in the Bootstrap repo about all this, Why has Bootstrap 4 changed to using rem? · Issue #19943 · twbs/bootstrap · GitHub. This is a good comment in there, https://github.com/twbs/bootstrap/issues/19943#issuecomment-224439306

It’s not a quick simple fix, but given this is OSS, I’m sure there would be many that could help with this.

Side note: I think this could be a great issue that could be done with mentors/mentees that are interested in CSS.

Describe alternatives you've considered N/A

Additional context

image

image