Mobile Friendly Issue

Home Forums Forstron Mobile Friendly Issue

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #22633
    transitionsit
    Participant

    Mobile Friendly Issue

    Resolved

    Hey there! Have you noticed this support service is provided FREE of charge?
    If you like the speed and accuracy of resolutions, please consider supporting me with a small donation. Thank you

    Consider a donation →

    Hi there. Some of the text is having issues on mobile phones.

    See examples. I’m unsure what to do here and could really use some help.

    This occurs in a few places.

    Thanks!!

    #22634
    Oliver Juhas
    Keymaster

    Hi transitionsit,

    Please note that your image exceeded max allowed file size. Try to make your image smaller (use JPG file format) and reattach it again please. Thank you.

    Best regards,

    Oliver Juhas
    WebMan Design

    #22641
    transitionsit
    Participant

    You could have just gone to the URL I posted…

    Re-attached

    #22649
    Oliver Juhas
    Keymaster

    Hi transitionsit,

    Please note that I couldn’t know what you mean by “Some of the text is having issues on mobile phones”. The behavior on your screenshot is actually normal, just as expected, but I get what you mean, that long words get broken on narrow screens.

    This is actually a required styling for WordPress themes. No word, as long as it is, can not cause horizontal scroll and that’s why it needs to be broken into multiple lines.

    In your case, however, I can see you’ve build the page using Beaver Builder and applied custom font size on specific affected texts. The easiest solution to resolve this issue in this case would be to set a smaller font size for mobile devices in the page builder.

    Additionally you can apply this custom CSS to take care of the problem for default theme styles if needed (edit the code to your needs):

    @media (max-width: 480px) {
    	h3, .h3 { font-size: 1.25em; }
    	h2, .h2 { font-size: 1.5em; }
    	h1, .h1 { font-size: 2em; }
    }

    Best regards,

    Oliver Juhas
    WebMan Design

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.