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 Fullwidth Menu: How to center all items properly?

Discussion in 'Free Divi Community Forum' started by nkls3, Aug 10, 2019.

  1. nkls3

    nkls3 New Member

    Hi everyone.
    I've created a fullwidth menu and changed the design a bit but I'm not very happy about the alignment of the items. Opening "Mathematik" or "Physik" will open up a Divi mega menu.
    Is it possible to center all items (including the items from the mega menu) so that everything is centered in the middle of the users screen (I added a red line to show you where I'd like to have the items aligned/centered at).

    Would be glad if anyone has got some ideas.

    upload_2019-8-10_15-56-37.png
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade before / after image slider for your Divi site without using any plugins:View Demo
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

  3. nkls3

    nkls3 New Member

    Thanks that worked perfectly!
    Just that I understand what you've done there:
    The items are not aligned correctly due to the little dropdown icon next to them, right?
    So I think you used Inspect Element and you got the pixels of the dropdown icon from there?
    The dropdown element has a width of 22 px and a padding-right of 10px.
    So would it be -32px instead of -31px?
    Thank you so much for your help!
    upload_2019-8-10_16-49-10.png
     
    1. PRO MEMBER PERKS Divi.Help Layout AI Generator - Try the power of AI to generate a custom Divi layout for you:Try Now
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    Yup. And for original Divi CSS (.et_header_style_fullscreen #mobile_menu_slide .menu-item-has-children), it's making the whole container with the child menu to have negative margin, which is causing the misalignment. That's why we changed it back to 0 margin:
    Code:
    Log In or Sign Up to view this code.
    And use the below CSS to offset the menu item only. Not the whole container with the child menu.
    Code:
    Log In or Sign Up to view this code.
     
  5. nkls3

    nkls3 New Member

    Thanks, but is -32px or -31px margin-right correct?
    According to the Chrome DevTools the dropdown element has a width of 22 px and a padding-right of 10px.
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade rolling text design for your Divi site without using any plugins:View Demo
  6. Divi.Help

    Divi.Help Administrator
    Staff Member

    We just took the -31px from the original Divi CSS. You can try to see which suits you best.