Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #1216745

    Hi,
    the H1 Title not showing well on the smartphone.
    If the word is longer, it will not fit to the smartphone- what is the solution?

    Thanks,
    Ivan

    #1216773

    Hey iicinfo,

    Please provide a link to the site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    #1216775

    Hi Jordan,
    thank you for the answer.

    I put a link in.

    Regards,
    Ivan

    #1216777

    … and it is probably the H2 Title which is not complete showing (also on the deskop).

    #1217134

    Hi,

    Add this to quick css:

    @media only screen and (max-width: 767px)  {
    .template-page .entry-content-wrapper h2 {
    font-size:100%!important;
    }}

    Best regards,
    Jordan Shannon

    #1217405

    Hi Jordan,
    thanks a lot. It works much better. But please check the second H2 in the page I send to you, there is an word it is again too long.

    Also an H1 Headline in another subpage is not displaying well on mobile version(I post an link).

    Thanks,
    Ivan

    #1217907

    Hi,

    Please replace the CSS Jordan sent with this:

    @media only screen and (max-width: 767px)  {
    .template-page .entry-content-wrapper h2 {
        font-size:100%!important;
        word-break: break-word;
    }
    }

    Best regards,
    Rikard

    #1219422

    Hi Rikard,
    thanks it works good.
    But I also see that the first H1 in the mobile version ist not display well.
    I post a link.

    thanks,
    Ivan

    #1219488

    Hi,

    Add this to quick css:

    .avia-builder-el-0.avia-builder-el-first{
        font-size: 50%!important;
        word-break: break-word!important;
    }

    Best regards,
    Jordan Shannon

    #1219835

    Hi Jordan,
    thank you it works but it “breaks” the word without an “-” so this would be an grammatic mistake. Is it possible to break the word with an “-“?

    Thanks,
    Ivan

    #1219871

    Hi,

    Unfortunately the word can’t be broken in that manner.

    Best regards,
    Jordan Shannon

    #1220838

    Hi Jordan,
    thanks for mail.
    What is then the solution ?
    If I let it with your code it will display wrong on the mobile phone. It will be an mistake in grammer / spelling in Germany…

    Regards,
    Ivan

    #1221698

    Hi Jordan,
    you would also hep me if I could make the size of the text of H1 smaller for mobile devices.
    I posted you a link where I find an solution. Maybe it is the same or similar code for your theme?

    Ivan

    #1222539

    Hi,
    Sorry for the late reply, to change the font size of h1 on mobile, I looked at your page and the heading “Innovations Management Software”, for this structure please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    @media only screen and (max-width: 767px) { 
    	.avia_textblock h1 {
    		font-size: 24px !important;
    	}
    }

    adjust the font size to suit.
    After applying the css, Please clear your browser cache and check.

    Best regards,
    Mike

    #1223209

    Hi Mike,
    thanks a lot. It work :)

    Regards,
    Ivan

    #1223347

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

    Best regards,
    Mike

Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘H1 Title in Smartphone’ is closed to new replies.