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

Solved DIVI Header Style 11 -

Discussion in 'Basic Support Forum' started by laurenbach, Aug 27, 2020.

  1. laurenbach

    laurenbach Member
    Divi Ultimate Header Plugin

    Hi Divi Header Support-
    Do you have any rollover styles for Header #11? I clicked on the Hover style effects #1, 2 or 3 and nothing happens perhaps there are no style effects for #11.

    How do I make the rollover effect on the primary menu go from blue to orange I have the color values just let me know. Here is the link - http://c7a.f9a.myftpupload.com/.

    I also can't the the Get In Touch rollover back to go from White to Blue it stays at blue and I opened in Front End Building went to the settings for the button < Design < Button < Hover icon for Background and changed to blue but just makes button background color blue and I would like it to go from white to blue.

    Also would like to center the Email, Phone # and location in the Blurb module but after centering body text, title text and module alignment nothing works under the design tab of each blurb module.

    Please advise.

    Lauren B.
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade horizontal timeline design for your Divi site without using any plugins:View Demo
  2. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    You can change the menu hover style in Theme Customizer > Divi Ultimate Header Plugin > Vertical Navigation > Choose your custom menu hover style
    You should be able to change it in the button module settings.

    Alternatively, you may use the below CSS to change the button background color:
    Code:
    Log In or Sign Up to view this code.
    It's a bit more complicated, as there are 2 columns.

    But here's what you need to do:
    1. Edit your custom header style.
    2. Switch to wireframe mode.
    3. Move the button module to right before the blurb module.
    4. Change the Row Settings to be 1 column.
    5. Then go to the Blurb module settings > Advanced > CSS Class & remove free-float-left-desktop
    6. Then go to the Row settings & set it to align center.
    7. Lastly, just adjust any padding / margin to suit your need.

    Let me know how it goes.
     
  3. laurenbach

    laurenbach Member
    Divi Ultimate Header Plugin

    Hi DIVI Header Support-
    I am not sure what Wireframe mode is but I am in the Classic Editor and for the Header Style 11 Edit and this is what I see the Button module is to the right of the Blurb. Let me know if I am supposed to move the Button to the left of the Blurb modules so it is Column 1 is that what you are saying to do? I would like the Button to stay in the Upper Right corner so moving it to Column 1 in front of the 3 blurb modules would move the button to the left in the primary menu which is not what I want to do. See attached. All i want is to make the text in those 3 blurb modules centered with the Orange Bar on this site - http://c7a.f9a.myftpupload.com/.

    Let me know.

    Thanks, Lauren B.
     

    Attached Files:

    1. PRO MEMBER PERKS Divi.Help Header AI Generator - Try the power of AI to generate a custom Divi header for you:Try Now
  4. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Yes. And you need to place it right below the 'Override Blurb Padding' module / above the blurb module.

    And you will need to change the Row structure to be 1 column:

    upload_2020-8-29_10-55-47.png

    Lastly, just follow the steps written at the previous post: https://divi.help/threads/divi-header-style-11.6551/#post-21146
     
  5. laurenbach

    laurenbach Member
    Divi Ultimate Header Plugin

    DIVI Header Support-
    Ok I followed your instructions and now it seems that there is some unwanted padding or margins in the orange blurb modules in one row - see links - http://c7a.f9a.myftpupload.com/. I went back and tried to remove the "free-float-left-desktop" but it made it worse with the margins I just want that to be back to the normal Blurb module margins - I see that it is centered better after I moved to one column.
     
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  6. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Upon checking your site, it seems like your Row Settings doesn't have any previous settings applied.

    1. Go to the Row Settings & set the width and max-width to be 100%.
    2. And for the empty space above, go to the code module settings ('Override blurb padding') & set the margin-bottom to be 0.
    3. Lastly, you may just go to the blurb module settings & change the margin-top to be 10px.
     
  7. laurenbach

    laurenbach Member
    Divi Ultimate Header Plugin

    Thanks!

    1) How do I now center the 3 blurb modules so that they are not justified left? Is that in some custom coding somewhere as I have adjust the section, row and blurb modules to align center but nothing happening?
    2) Also how do I get rid of the slide margin above and below the Get in Touch button as well?
    3) I would love to have the rollover text be white vs. orange on the blue background rollover color too.

    Please advise. Lauren B.
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade dynamic background hover design for your Divi site without using any plugins:View Demo
  8. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Same method as my previous post.

    Here's the steps:
    1. Move the button module to be in front of the blurb module.
    2. Set the button module margin bottom to be 0.
    3. Then go to the Blurb module settings > Advanced > CSS Class & remove free-float-left-desktop
    4. Then go to the Row settings & set it to align center.
    5. Lastly, just adjust any padding / margin to suit your need.
    Just go to the Row Settings & set the padding top and bottom to be 0.
    Try the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
  9. laurenbach

    laurenbach Member
    Divi Ultimate Header Plugin


    The 3 Blurb modules still won't center align. HELP!

    Thanks, Lauren B.
     
    1. PRO MEMBER PERKS Divi Block Pro - Easy-to-use drag & drop interface to mix & match 456+ premade Divi blocks & export as json file:Learn More
  10. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Kindly check your PM.
     
  11. laurenbach

    laurenbach Member
    Divi Ultimate Header Plugin

    What does PM mean? Please clarify. I need to show this site soon if you can help me on this. Thanks, Lauren B.
     
    1. PRO MEMBER PERKS Divi.Help One-Page Layouts - Beautifully crafted one-page Divi layouts just for you:View All Layouts
  12. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    PM is referring to Private Message. You can check your PM by hovering over the envelope icon at the top right side. See screenshot below:

    upload_2020-9-8_11-36-34.png

    We sent you a PM, as we need your temporary login details to make the changes for you.