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

    I have two pages that use the special heading as a H3 tag and one has a top-margin and the other doesn’t. I know I can tweak the CSS to remove the margin but trying to figure out why they are not consistent.


    .av-special-heading {<br />
    clear: both;<br />
    display: table;<br />
    margin-top: 50px;<br />
    width: 100%;<br />


    This overwrites the margin-top: 50px; inthe code above.

    body .container_wrap .avia-builder-el-first {<br />
    margin-top: 0;<br />


    Hey kcharity,

    We’ll need to see the two pages live and inspect the code on our end. If you can also give a brief overview of how the items are laid out in your visual editor/advanced layout editor that will help as well.




    Hey Devin,

    I’ve included links to our devsite and they will expire in two days:

    Extra Top Margin Page:

    Margin is ok:

    From what I can tell is the Div for the special heading with the extra padding is missing the “avia-builder-el-first” class so the CSS below is not associated to it like the page with the correct styling.

    body .container_wrap .avia-builder-el-first {
    margin-top: 0;

    Both pages appear to be identical I used a template in the editor. with a 2/3 and a 1/3 column. The 2/3 has a special heading set to H3 with Modern followed by a text block.


    Did you make the two pages at different times? Maybe between upgrades? I tried duplicating the layout of the page where the item isn’t getting the correct class but I’ve not been able to going off the look of the layout.


    The issue is apparently the Video component in the 1/3 column to the right in the color section. Once I remove that the margins are aligned properly.

    Can you verify that and provide a solution?


    I am not getting the same results. Did you try re-building that page? Have you updated to the 1.7.1 release?


    Yes I am running the latest version and recreated the page. Once I delete the video out of the 1/3 column all is fine.

    The page is built with:

    color section with 2/3 and 1/3 inside (video in the 1/3)

    then a 1/1 with text block inside.

    a hairline with whitespace

    then a 2/3 (with a special heading and text block) and 1/3 (with an image)


    Using that layout I’m still not getting the same error. I’ll tag the other support crew to see if they can re-create it on their end.





    The links you pasted above have expired. Please repost them again.




    URL with bad formatting:

    Copy of above with video removed (formatting ok):


    Both links work fine for me.


    The header with the video has this class:

    av-special-heading meta-heading blockquote modern-quote

    The header without the video has this class:

    av-special-heading meta-heading blockquote modern-quote avia-builder-el-6 avia-builder-el-first

    The CSS adding top margin like this:

    .av-special-heading {
    clear: both;
    display: table;
    margin-top: 50px;
    width: 100%;

    By removing the video ‘.avia-builder-el-first’ gets added to the CSS class so the new CSS is this:

    body .container_wrap .avia-builder-el-first {
    margin-top: 0;



    Did you try modifying the selector on your custom.css or Quick CSS?

    .av-special-heading.meta-heading.blockquote.modern-quote {
    margin-top: 0 !important;




    That was going to be my fall back. I wanted your team to be aware of the bug.


    I’ve still not been able to actually re-produce it. Even when creating a layout based on what you are saying breaks it so I’m not sure what the difference could be.

    The above will definitely fix I can’t quite say its a bug at this point as locally and live its not repeatable from what I can see.



Viewing 16 posts - 1 through 16 (of 16 total)

The topic ‘Top Margin on H3 Special Heading not consistent’ is closed to new replies.