Responsive text issue

Support
#1

Hi everyone. I’m having trouble understanding how to fix a responsive text issue on my homepage. At a certain point, the subtitle font gets really small, and the padding around the entire area is huge. It seems to only be an issue at this particular width. What am I missing? (www.aveil.org) Thanks in advance.

#2

Hello @jenaolson,

Thanks for asking. :slight_smile:

Can you please let us know the resolution you are facing this problem? On Google Chrome dev tools responsive emulator I tried on few screen sizes and it seems to be working fine. However on tablet devices I can see few issues. Please add following CSS under X > Theme Options > CSS and let us know how it goes:

@media 
  (min-device-width: 600px) 
  and (max-device-width: 900px) {
      .e7-4.x-text {font-size: 1.7em;}
    .e7-5.x-text {
        font-size: 1.2em;
    }

}

Thanks.

#3

Between 478x715 and 766x715 is where it becomes a problem, when I’m viewing on my laptop.

#4

Hi There,

Please navigate to Theme Options > Typography and adjust the root FONT SIZE (XS) and root FONT SIZE (SM) and also adjust the font-size on your text element.

I did check your subtitle and its font-size is relative to those settings.

Hope it helps,
Cheers!

#5

Brilliant, that made the difference. Thank you!

#6

You are most welcome. :slight_smile:

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.