Z-index doesn’t work with avada theme

  • marketo11

    (@marketo11)


    8 years, 3 months ago

    Hi,
    firstly I have to say thank you for this amazing free plugin and for the support you bring to us.
    The sticky element works great but with my avada theme the z-index seems doesn’t work fine.
    I Always have the sticky element under the content.
    I tried some different z-index and some different css tricks but when you go scroll down the sticky element is hidding itself over the content.

    Can you check it if you see how to solve this problem?

    Thank you for your great work and support!!

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Senff – a11n

    (@senff)

    8 years, 3 months ago

    You can fix this by adding the following CSS code:

    .page-id-989 .post-content > div:first-child {
	z-index: 1000;
}

    However, you also need to increase the value for the space between sticky element and top of the page (from 43 to something higher, I believe 83 would do the trick) because right now it’s hiding behind the blue header.

    trxadmin

    (@trxadmin)

    8 years, 3 months ago

    Mark,
    I was standing by to see if you had a fix that worked for me as well. Sorry to say my has an added level of complexity. I an using this across multiple pages and using the themes global element. So the .page-id works great on the page with the named ID but not the others. Is there a different work around? Say adding a class or adding in multi page ID’s.
    I have turned off the plugin for now.
    Many thanks in advance for any help or advice you can give.
    Bruce
    http://www.arbormontessori.org/admissions/tuition-and-fees/
    http://www.arbormontessori.org/prospective-parents/
    http://www.arbormontessori.org

    Thread Starter marketo11

    (@marketo11)

    8 years, 3 months ago

    First of all,
    Mark, thanks a lot for your fix css code but how trxadmin says it only affect one page with specific id.

    I found another solution that it works in all pages. trxadmin, if you are using avada, you can try if it helps for you too.

    In your avada-child theme, in your style.css try this:

    .fusion-fullwidth .fusion-row {
position: unset!important;
}

    Thanks again Mark for your time trying to help us.

    • This reply was modified 8 years, 3 months ago by marketo11.
    • This reply was modified 8 years, 3 months ago by marketo11.
    trxadmin

    (@trxadmin)

    8 years, 3 months ago

    Marketo11,thank you for the css snippet, it works perfectly!

    …and Mark thank you too for writing a great plugin.

    Thread Starter marketo11

    (@marketo11)

    8 years, 3 months ago

    I’m glad it helped to you tradmin!!

    Mark, I have another question about to move up and down the sticky element when is responsive.
    I’m using 

    @media (min-width: 990px) and (max-width: 1248px) {
	.element-is-sticky {
        margin-top: 43px!important;
	}
}

    but there’s a better way to do this?

    Thanks!!

    • This reply was modified 8 years, 3 months ago by marketo11.
    • This reply was modified 8 years, 3 months ago by marketo11.
    Senff – a11n

    (@senff)

    8 years, 3 months ago

    @marketo11 My apologies for the delay. It looks like things are working on your site now (I see you’ve used the option “space between top and sticky element” in the plugin settings), are you all set or do you need any further help?

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Z-index doesn’t work with avada theme’ is closed to new replies.