Tagged: ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • June 28, 2018 at 3:30 pm #978916
    zugerberg-finanz

    Hi,
    I would like to have different font sizes for the subtitle in H2 and H3. I would have liked to do that via CSS. But did I only find the class .av-subheading p:last-child that fits both (!) sizes? Is there a other way to solve this?
    Furthermore: if I select and save the text size of the subtitle in the Avia layout element “special heading”, it is not displayed correctly in the frontend.

    June 30, 2018 at 9:11 pm #979637
    Mike

    Hey Esther,
    You can target the h2 & h3 special heading with the classes “.av-special-heading-h2” & “.av-special-heading-h3”
    or with “.av-special-heading-h2 h2” & “.av-special-heading-h3 h3”
    Like this:

    
.av-special-heading-h2, .av-special-heading-h2 h2{
font-size: 70% !important;
color: blue !important;
}
.av-special-heading-h3, .av-special-heading-h3 h3{
font-size: 70% !important;
color: yellow !important;
}

    notice the two class types are separated with a comma to target all of them, as an example. I would recommend adding your page or post classes to each rule because using them globally can cause some unexpected changes.
    The sub-headings use the classes “av-subheading” or “av-subheading_below” or “av-subheading_above”
    Please give these a try, if you still have trouble, please post a link to the page and explain what you want and we will assist.

    Best regards,
    Mike

    July 2, 2018 at 3:53 pm #980127
    zugerberg-finanz

    Hi Mike,
    Thank you for you help, but… I placed this code to the Quick CSS field:

    .av-special-heading-h2, .av-special-heading-h2 h2,
    .av-subheading-h2, .av-subheading-h2 h2,
    .av-subheading_below-h2, .av-subheading_below-h2 h2,
    .av-subheading_above-h2, .av-subheading_above-h2 h2
    {
    font-size: 30px !important;
    }
    .av-special-heading-h3, .av-special-heading-h3 h3,
    .av-subheading-h3, .av-subheading-h3 h3,
    .av-subheading_below-h3, .av-subheading_below-h3 h3,
    .av-subheading_above-h3, .av-subheading_above-h3 h3
    {
    font-size: 22px !important;
    }

    But, doesn’t work on my webside :-(

    Any other ideas? Thank you,

    Best regards,
    Esther

    July 2, 2018 at 7:07 pm #980223
    Jordan Shannon

    Hi,

    Did you make sure to add your code to the very top of quick css so it runs first? Also, be sure to clear your cache a few times over.

    Best regards,
    Jordan Shannon

    July 12, 2018 at 9:51 am #984577
    zugerberg-finanz

    Hi Jordan
    No, it still doesn’t work :-(
    What else could i try? Thanks for your advice.
    Best regards, Esther

    July 12, 2018 at 11:41 am #984638
    zugerberg-finanz

    Hi Jordan
    I think there’s something incompatible with this class:
    #top.all_colors p {
    font-size: 16px;
    }
    If I deactivate the value, other entries take effect. Is it possible that this class is not compatible with the values entered in the backend or that subtitles are therefore not displayed in the correct size in the frontend?

    Best regards,
    Esther

    July 12, 2018 at 1:27 pm #984724
    Mike

    Hi,
    This is because the sub-heading “Impressions” is not within the “h2” or “h3” tag, but it is in a “p” tag so your code was setting the rule:

    #top .all_colors p {
font-size: 16px;
}

    Also in your other code above, the “.av-subheading_below-h2” is not a class that is used, so it has no effect.

    I see that you are trying to have a different sub-heading font-size based on the heading size, h2 or h3.
    Please try this for h2 sub-headings:

    #top .all_colors .av-special-heading-h2 .av-subheading_below p {
font-size: 30px !important;
}

    and this for h3 sub-headings:

    #top .all_colors .av-special-heading-h3 .av-subheading_below p {
font-size: 22px !important;
}

    Best regards,
    Mike

    July 12, 2018 at 3:32 pm #984799
    zugerberg-finanz

    Hi Mike

    Thanks for that – it’s fantastic! I’m very happy :-)

    Have a nice Day,
    Best regards, Esther

    July 13, 2018 at 3:53 am #984939
    Mike

    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 under Enfold sub forum and we will gladly try to help you :)

    Best regards,
    Mike

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Headlines Style – modern left – Font size Subtitle’ is closed to new replies.