#132696 Headlines (H1/H2) are not responsive in WP-Backery — Too big for mobile

Landing Forums Jupiter WordPress Theme Headlines (H1/H2) are not responsive in WP-Backery — Too big for mobile

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • Alona Troppmann

    H1/H2 Headlines in WP-Backery are not responsive – too big for Mobile Devices.

    If I insert a fancy title – Headline 2 (for ex.) and Force Responsive Font Size: Mobile =20 –> the title font will not be konverted to 20 in Mobile, ist still too large as in desktop.

    https://personal-polen.de/personal-aus-kroatien/

    Please make the Headlines responsive for Mobile. (H2=20 px).

    Thanks

     

    Nodari Support Team

    Hey there

    I just tried your problem and as I see font size is changed to 20px, here is the screenshot: https://prnt.sc/1uu41ac probably you need to make it smaller than 20px

    Regards

    Alona Troppmann

    Hi, the Problem is: if I set the fancy title to = Absatz / Text, then I can set the mobile font size to 20 and it works.

    If I set the title to H2, than the mobile size = 20 doesn’t work. I Think the H2 size for mobile should be changed.

    See Attachment.

    Nodari Support Team

    Alona, I see your problem, the fancy title is H2 itself (https://prnt.sc/1uu41ac) and when you put another h2 inside, it becomes in conflict with the setting, you should not use any other H tag for your text and in the text box and settings will work correctly.
    Did I answer your question? 🙂

    Best

    Alona Troppmann

    Hi, I see, but its not only H2 in the fance title that have Problems in Mobile, but also H2 in text block (see attachment)

    https://personal-polen.de/arbeitnehmerueberlassung-aus-polen/

    Nodari Support Team

    Hi Alona

    Hm, well, it’s an H3, not an H2: https://prnt.sc/1uzr89j and as I can see style is normally reflected for H3 as well 🙂
    Alona, is anything that is not working here as intended?

    Best

    Alona Troppmann

    Hi,

    H3 is as well as H2 & H1 are not responsible for mobile.

    I habe created a test page with H1/H2/H3 inserted as a text block as well as Fancy title. Test this page in Mobile and you will see that also they are too big for mobiele and in fancy title “force for mobile” values doesn’t work.

    https://personal-polen.de/test/

     

    Nodari Support Team

    Hi Alona

    Ok, I understand your problem, here is the code that will change the font size for small screen devices under 968px

    /* H1 in text box */
    @media handheld, only screen and (max-width: 968px){
    .master-holder h1 {
    font-size: 20px;
    }
    }
    /* H1 in fancy text */
    @media handheld, only screen and (max-width: 968px){
    .mk-fancy-title h1 {
        font-size: 20px;
    }
    }

    You can use this code to modify other H tags, simply change h1 to h2

    Code can be added in the APpearance > Customize > Additional css

    Regards

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