Font size in responsive with unexpected results

Author Posts

jassheridan

Hey. I have set title font size using Microthemer for the event title in this page. Basically the words FREE TRIAL CLASS in each section. Looks perfect in each size in the Microthemer layout. BUT if I resize the page in my browser slowly there is a midpoint where the title font size is massive and looks weird.
Am I missing something obvious? Maybe a conflict with media query break points between microthemer and beaver builder? Any assistance appreciated. I don’t know how to inspect and diagnose this myself.
https://krav-maga.org.uk/free_trial_classs/
Thank you


Sebastian

Hey,

Thanks for sharing the link. The text is larger at certain screen sizes (980px – 1200px) because your media queries don’t target that range. One option is simply to set the font-size to e.g. 22px via the All Devices tab, so that the Beaver Builder font-size (30px) is overridden.

Another option is to create a new media query via the Edit media queries popup e.g.

@media (max-width: 1199px)

What ever you prefer!

I hope that helps. Please let me know if you need further assistance with this.

Thanks,
Sebastian


jassheridan

Thanks Sebastian – as per usual something simple !! I had 18 but not 18px in the AllDevices tab ☺️


Sebastian

Hey,

18 without the pixel bit should have worked if entered via the font-size property field. Or were you using the custom code editor to the left of the Font property group?

Cheers,
Sebastian

You must login or register to reply to this topic.