Create class to resize h1 in mobile

[martalongan]

Hello!

I have a problem with the size of the fonts on my website when they are displayed on mobile, what can I do? they don’t get small 🙁

Thanks!

[martalongan]

Sorry, my web is: http://www.martalongan.es and the problem is here: https://www.martalongan.es/index.php/sobre-mi/ the text:
+10 years of experience is a giant in mobile, for exemple…

[SeaTheme]

Hi,

I checked your website, I found you use inline font size 60pt. Please try to use VW unit, like font-size: 9vw;

Regards!

SeaTheme – SeaTheme.net – Twitter – Facebook

[martalongan]

Thanks for your quick response 🙂

It is a good solution but for the mobile to look the correct size in the desktop version it must be giant and it does not look good 🙁

Can I make the mobile have one size and the desktop another?

Thanks! 🙂

[SeaTheme]

Hi,

Please remove the font-size from the inline style, use the class, like :
<p><span class="h1-custom" style="font-family: Sen; color: #030814;">años de experiencia</span></p>

Define font size by the custom CSS(“Appearance > Customize: Additional CSS”), like:

.h1-custom{
  font-size: 7vw;
}
@media(max-width:767px) {
/*mobile*/
  .h1-custom{ font-size: 5vw; }
}

Regards!

[martalongan]

Great! now yes, solved.

Thank you!

[pawlakstawarski]

Hello,
I added custom class:

.podpis-zdjecia{
  font-size: 9px;
}
@media(max-width:767px) {
/*mobile*/
  .podpis-zdjecia{ font-size: 4px; }

to change font size on mobile but it doesn’t work. Can you check it? On desktop font size is changing properly.
new.pawlakstawarski.com/arch/

[SeaTheme]

Hi,

This topic is for the Air HTML template.

The CSS will not work for ART WordPress theme
Please refer to how to set font size for mobile(BM content builder): https://doc.seatheme.net/sea-content-builder-plugin/text-module/#font-size-for-mobile

Regards

[Author]

Posts