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

Mobile spacing override question

Discussion in 'Free Divi Community Forum' started by chris r, Nov 18, 2019.

  1. chris r

    chris r Member

    Hi,

    I'm using a Circle counter module and on desktop view want it moved 50px to the left, but on tablet and mobile want it centered.

    In the Spacing section of the module in Divi, I can use -50px for the left margin. However, there doesn't seem to be a way to, for tablet/mobile, to go back to the default centering of what is basically "margin: 0 auto". If I use 0 as a left margin it doesn't center.

    The issue is that if I use custom CSS in Theme Options to change the margin only for tablet/mobile (<980px wide), even with !important, the Divi module overrides my CSS change when I look at the Inspector. So I can't seem to override the tablet/mobile margin.

    Is there a way around this?
     
    #1 chris r, Nov 18, 2019
    1. PRO MEMBER PERKS Divi.Help One-Page Layouts - Beautifully crafted one-page Divi layouts just for you:View All Layouts
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    You can set it right in the module settings margin option. See screenshot below:

    upload_2019-11-19_11-27-23.png
     
    #2 Divi.Help, Nov 18, 2019
  3. chris r

    chris r Member

    That doesn't work for me. When I enter '-50px' for desktop, then go to Tablet and enter 'auto', it resets to '-50px' per screenshot.

    Our hosting hasn't upgraded to version 4 of Divi. We're on 3.2 I think. Perhaps that's the reason?
     

    Attached Files:

    #3 chris r, Nov 19, 2019
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom header designs for you to choose from:View Demo
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    Maybe. You should try to update to the latest version & see if it works.
     
    #4 Divi.Help, Nov 19, 2019
  5. chris r

    chris r Member

    Unfortunately, we don't have the control to upgrade Divi on our hosting provider. Looks like custom CSS in the meantime.
     
    #5 chris r, Nov 19, 2019
    1. PRO MEMBER PERKS Divi Block Pro - Premade gradient text design for your Divi site without using any plugins:View Demo
  6. Divi.Help

    Divi.Help Administrator
    Staff Member

    What about the below:

    upload_2019-11-19_23-8-44.png
     
    #6 Divi.Help, Nov 19, 2019
  7. chris r

    chris r Member

    Thanks for the idea, though this version of Divi is missing the mobile icon:
     

    Attached Files:

    #7 chris r, Nov 19, 2019
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Freelancer' Divi layout for all Pro members:View Demo
  8. Divi.Help

    Divi.Help Administrator
    Staff Member

    Then you will need to add CSS Class in the Module settings > Advanced > CSS Class: dh-margin-auto-mobile

    Then add the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
    #8 Divi.Help, Nov 19, 2019
(You must log in or sign up to post here.)