I have written a component for a website that renders some HTML, and styles this HTML with CSS. So far, so good. Now we have the following constraints:
- The website sets a
font-sizeforbodyof14px(this is not under my control). - The CSS of the component makes use of
remforfont-size(this is not under my control either).
Now the problem is that the component renders too small, because it assumes to have a font-size of body of 16px. Yes, I know, the question of course is why rem is then used, but as said, this is outside of my control
Now my question: Assumed I want the component to use a base font-size of 16px, and assumed that I need to stick with rem, and assumed that I need to stick with 14px for body - what is the easiest way to fix this mess?