search

xi / a11y-outline

web extension to navigate document outlines easily
https://addons.mozilla.org/firefox/addon/a11y-outline/
BSD 3-Clause "New" or "Revised" License
36 stars 3 forks source link

Small font size with sites using html { font-size: 62.5%; } #4

Closed PhilippeVay closed 6 years ago

PhilippeVay commented 6 years ago

… which are countless doing:

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
}

because it's then really easy to use rem or em unit by thinking in pixels and having to divide by 10 and not having to use a calc or a mixin in a preprocessor.

The extension sets body>dialog to 0.9rem thus gives 9px like in our site https://www.alsacreations.com (screenshot below):

screenshot of alsacreations.com with extension enabled showing very small text

I'd suggest using em unit (or maybe font-size: inherit;, equivalent to 1em here) in #a11y-outline { font-size: 0.9em) would fix this problem because dialog is a direct descendant of body.

xi commented 6 years ago

I would advicate against such pratices and just learn to use px/em/rem properly, but I understand that this is just the way it is.

Thanks for the feedback!