Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 23, 2018 at 4:27 am #916494
    webWahine

    Hello
    I have a site in development. On this page I’ve styled some special headers –
    http://azureatsouthgate.com/
    I want to be able to have an option to position the default special heading in the center of the page, but can’t get that to work. So, I’ve added in the special heading modern centered example but I want the bottom line to only be as wide as the text, just like the default examples. I’ve tried lost of css to target just the h2 etc but it’s not working so I think I’m not using the correct sytnax. Here’s some of my efforts, below.

    I’d like the modern centered example to have the same text width only border as the default, plus how do I target the sub heading, please?

    Thank you – I’ve looked at tons of posts but couldn’t get it working.

    .av-special-heading-tag {
    padding-bottom: 20px !important;
    border-bottom: #888a8d 1px solid !important;
    margin-bottom: 60px !important;
    }

    h2.av-special-heading-tag {

    }

    h3.av-special-heading-tag {
    float: right !important;
    }

    h2.av-special-heading.blockquote {
    border-bottom: #000 10px solid !important;
    }

    h2.av-special-heading.blockquote > * {
    border-bottom: #000 10px solid !important;
    }

    .modern-quote .av-special-heading-tag {
    padding-bottom: 20px !important;
    border-bottom: #ff3300 10px solid !important;
    }

    February 24, 2018 at 8:16 pm #917213
    Mike

    Hey webWahine,
    To position the default special heading in the center of the page, try this css:

    .av-special-heading-h2.avia-builder-el-4 {
    float: none!important; 
   width: 50% !important;
   left: 28% !important; 
}

    2018-02-24_131431

    Best regards,
    Mike

    February 27, 2018 at 9:27 pm #918641
    webWahine

    Ok, super! That worked nicely for the default special heading if you target the specific element, thank you!

    Also, part two of my question was –
    I’d also like the modern centered example to have the same text width only border as the default, plus how do I target the sub heading to style it, please?

    February 27, 2018 at 9:40 pm #918650
    Jordan Shannon

    Hi,

    Can you provide a screenshot of what you need fixed for the second part of your question? I’m having a bit of trouble understanding what you need.

    Best regards,
    Jordan Shannon

    February 27, 2018 at 9:58 pm #918656
    webWahine

    Here you go –

    http://azureatsouthgate.com/images/styling.jpg

    Thanks, Jordan! :)

    February 27, 2018 at 11:03 pm #918699
    Jordan Shannon

    Hi,

    That is actually a border added via css which won’t work as far as making it span just the width of the text. Perhaps use a horizontal rule instead and style accordingly.

    Best regards,
    Jordan Shannon

    February 28, 2018 at 12:25 am #918749
    webWahine

    Ok, I wondered about that.
    I still need to know how to target the text to style subheading for modern centered with my own css, please :)

    February 28, 2018 at 12:46 am #918753
    Jordan Shannon

    Hi,

    You need the style for the same text with the border?

    Best regards,
    Jordan Shannon

    February 28, 2018 at 12:58 am #918756
    webWahine

    No, I’d like it to be a different colour, size, letter spacing etc.

    February 28, 2018 at 5:58 pm #919200
    Jordan Shannon

    Hi,

    Sorry for the miscommunication, but I mean which text exactly do you need modified?

    Best regards,
    Jordan Shannon

    February 28, 2018 at 6:22 pm #919214
    webWahine

    It’s ok, I figured it out – it’s this, thanks! :)

    .av-subheading_below p {
    /* put styles here */
    }

    February 28, 2018 at 6:35 pm #919219
    Jordan Shannon

    Hi,

    No problem at all. If you need additional help on other topics please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Style special heading modern’ is closed to new replies.