1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Divi popup form on click appears behind footer

Discussion in 'Free Divi Community Forum' started by Jonas Skalbo, Feb 4, 2020.

  1. Jonas Skalbo

    Jonas Skalbo New Member

    Hi there,

    I don't have much knowledge about coding, which i why i seek your help. I followed this guide: https://www.elegantthemes.com/blog/divi-resources/how-to-create-a-contact-form-on-click-with-divi to make a form that pops up when you click a button.

    The problem now is, that when scrolling down, clicking the button near the footer, the footer appears in front of the contact form.

    Tried messing around with z-index and position, but honestly, i had no clue.

    Do you know how to fix it?
    (The following code has been added to the popup - no code added to the footer now)

    transform: translatey(-50%) translatex(-50%);
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1000;
    border: 2px solid #0c71c3;
    border-radius: 8px;

    - Jonas
     
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Beautify your Divi archive / category page with 15 different premade blog designs:Learn More
  2. SeanR

    SeanR New Member

    Not entirely an answer, but have you tried Popups for Divi Plugin I've had great success with it in the past.
     
  3. Jonas Skalbo

    Jonas Skalbo New Member

    Thanks for the suggestion - will give it a look.
     
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Replace the default archive "Older Entries" with beautiful pagination:Learn More
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    What about giving a higher z-index like 99999? If doesn't work, kindly share your URL.
     
  5. Jonas Skalbo

    Jonas Skalbo New Member

    Thanks for the suggestion, didn't work though.
    URL: https://auditconnect.dk/

    *The site is in danish, but scroll down to the green button in the footer area
     
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring modern overlay archive blog layout with hover effects:View Demo
  6. Divi.Help

    Divi.Help Administrator
    Staff Member

    Try the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
    Jonas Skalbo likes this.
  7. Jonas Skalbo

    Jonas Skalbo New Member

    Worked like a charm - thanks!
     
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring unique comment design on single blog post page:View Demo
  8. sigma

    sigma New Member

  9. Divi.Help

    Divi.Help Administrator
    Staff Member

    1. PRO MEMBER PERKS Divi Block Pro - Premade horizontal timeline design for your Divi site without using any plugins:View Demo
  10. Brian Smith

    Brian Smith New Member

    I also had the same issue and I thank you for your feedback, but when I apply this code, my header is cropped like the z-index was disturbing the modules inside my header.

    So instead to apply the z-index to the main content, this is not possible to force it only to the footer (I create a custom footer) ?
     
  11. Divi.Help

    Divi.Help Administrator
    Staff Member

    Kindly share your URL.
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade gallery carousel design for your Divi site without using any plugins:View Demo