1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, 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

Tabs interface with form in each of them

Discussion in 'Free Divi Community Forum' started by Loiseron, Nov 23, 2020.

  1. Loiseron

    Loiseron New Member

    Hi,
    Following this tutorial : https://www.elegantthemes.com/blog/...stom-testimonial-tabs-with-divi-free-download
    I'm trying to adapte it so that each tab have a different form in it.
    I've manage to replace with form and it work fine, on appearance at least.
    Opera Instantané_2020-11-23_140146_lecandide.info.png

    Cause when you dive into it, something's wrong. The only form working is the one from the last tab, and if you switch tab, it's always the last one that is selected, the other one can't be filled.
    And, if you complete the last one, the confirmation message appears but isn't included in the tab anymore. Opera Instantané_2020-11-23_140234_lecandide.info.png
    Opera Instantané_2020-11-23_140245_lecandide.info.png
    And now the third tab is usable.
    I'm completely new to this.... here's the link : https://lecandide.info/about/

    Can someone help me understand what i'm missing ?
    Thanks a lot !
     
    #1 Loiseron, Nov 23, 2020
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Freelancer' Divi layout for all Pro members:View Demo
  2. 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.
     
    #2 Divi.Help, Nov 25, 2020
  3. Loiseron

    Loiseron New Member

    Awesome ! It is working perfectly, can you explain why does it work that way ? I have read documentation about the "z-index" but that's not what I've understand of it....
    Thank a lot !
     
    #3 Loiseron, Nov 25, 2020
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Tons of elegant premade sidebar styles to choose from for your Divi site:Learn More
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    This is because your 4 different contact form are overlapping each other. By default, the last one will overlap all the other forms. So, I gave the active tab to have a higher z-index, meaning the active tab will always shows on top of the rest.
     
    #4 Divi.Help, Nov 25, 2020
(You must log in or sign up to post here.)