I’m building a Wordpress theme for Themeforest. In the customizer I’ve given users the ability to also use the rem unit for their font sizes. I’ve created three different settings that control the font-size on the html or :root element for three different media queries.
When I add the code for the :root or html in (1) a stylesheet or (2) wp_add_inline_style, the computing of the styles via the Browser takes too much time. The browser first renders all the text as if the rem size is 16px and after a second all the fonts scale to the correct size. This looks terrible.
The only solution to this problem is when I manually add a tag before the wp_head() action. In this way, the styles are loaded so early that the browser does compute them correctly. Adding the CSS in this location greatly improves the user experience.
Themeforest has the requirement that inline css is not allowed, except for background-images. If I’m creating a control for users to enable this, is it in this case allowed to use a tag?