Root Font Size

[cdelagarza]

Hi,

we’ve got some issues and questions about the root font size settings, especially when using the scaling option in combination with em (responsiveness).

Lower/Upper Limit

• What does Lower/Upper Limit exactly mean and what it is good for?

We’ve read this:

Minimum/Maximum Font Size: If you select the Scaling font size mode, you will have options to set the minimum and maximum font size and not specific sizes for each browser window width breakpoint.

But there is no information about if Lower Limit is px, em and so on?

Minimum/Maximum Font Size

• When do the settings take effect? How do these settings affect different screen sizes? e.g. the size settings in the individual post types, including blog, footer, header, content, layout, etc.

The current problem we are having is we are trying to set the font size for the mobile version (em) in a Global Footer - but the mobile version will not accept the setting. Is this something to do with Theme Options > Root Font Size?

size displayed in browser, 1.5em

size displayed on mobile, looks like 0.5em

Best,
Christopher

[ruenel]

Hello Christopher,

Thank you for your detailed post information. When setting up the root font size, it is best to use px and the minimum font size should be at least 10px. I want you to check out the links below to have a better understanding of the root font-size:

• https://medium.com/code-better/css-units-for-font-size-px-em-rem-79f7e592bb97
• https://css-tricks.com/rems-ems/

Hope this helps.

[cdelagarza]

Thanks for the further information, very enlightening!

I found another topic related to responsive text, here the recommendation is em, why do you recommend px in this case?

[prakash_s]

Hello @cdelagarza,

Sorry for the confusion, Our theme support both “px” and “em” unit. Glad that we were able to help you.

Have a great day!
Thanks