Font-size 62.5% in CSS HTML-rule

HTML/CSS
1

Currently watching “measurement units” of the HTML course.

In the course Mosh says that “Using 62.5% font-size in CSS makes it easier to work with the rem-unit”. See CSS-code below. So that 15rem = 150px because 62.5% of 16px results in 10px.

html {
  font-size: 62.5%;
}

.box {
  height: 100vh;
  width: 15rem;
  background-color: tomato;
}

But isn’t there a specific reason as to not just use the following:

html {
  font-size: 10px
}

Thanks in advance!

2

Hi, its because users can adjust the font size in the settings of the browser, if you set the font-size in the html element to absolute value like 10px; then when users adjust the font-size in the browser settings then it will have no effect on your page

1 Like
3

Ah right, I get it! Thanks!

1 Like