Menu
Sorry, I'm a little unsure of this.
I want my base to be 16px. But all the resources I read about rem use percentages, eg:
html { font-size: 62.5%; }
body { font-size: 1.4rem; } /* =14px */
h1 { font-size: 2.4rem; } /* =24px */
If I want all my rem sizes to be relative to 16px, do I just make html { font-size: 16px; }?
Why use percentages?
877
Rem (short for “root-em”) units dictate an element's font size relative to the size of the root element. By default, most browsers use a font size value of 16px. So, if the root element is 16px, an element with the value 1rem will also equal 16px.
In order to easily use rem, we can modify 1rem to be equal to 10px and then make the following computations: X / 100 * 16px = 10px => X = 62.5 => if we want 1rem to be equal to 10px, then we have to set the font-size on our site to be 62.5% of the default font-size.
yes that's right. You need to make your html font-size to 16px as your base font-size and then use rem with the rest. Rem sizes the element relative only to html while em sizes relatively to its nearest parent.
88
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
