We see many people setting html { font-size: 62.5%; } in their Frontend Mentor projects without considering the implications. Here's why you might want to reconsider this approach 👇
3
20
54
4K
15
Download Image
Firstly, what does html { font-size: 62.5% } do? The default browser font size is 16px. 62.5% of 16px = 10px. Now, 1rem equals 10px, so 1.6rem = 16px. This is often done to make rem-based sizing "decimal-friendly."
@frontendmentor I’m just learning layout now — this came at the perfect time 🙌
@frontendmentor Since the 1.6rem on the body has countered the 62.5% on html, how does this hurt accessibility? Any reason?