1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
HOT Divi.Help Pro One-Page Layouts - Beautifully crafted Divi layouts for you to kick start Divi sites.
View All Pro One-Page Layouts
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.
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved How to make logo area stick and above menu?

Discussion in 'Basic Support Forum' started by Rowan Griffiths, Feb 26, 2018.

  1. Rowan Griffiths

    Rowan Griffiths New Member

    Hi,

    How can we make the logo and contact area sticky when scrolling down as the menu (but above it)?

    Tried using the 'free-sticky' CCS-Class in the layout for the logo etc row, but it makes the menu go over the top of logo....


    Thanks
     

    Attached Files:

    #1 Rowan Griffiths, Feb 26, 2018
    1. PRO MEMBER PERKS Divi Ultimate Footer Plugin - Custom global Divi footer (20 premade styles) + Revealing footer effect:Learn More
  2. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Kindly provide me with your link & I'll give you custom CSS to achieve that.
     
    #2 Divi.Help Pro Support, Feb 26, 2018
  3. Rowan Griffiths

    Rowan Griffiths New Member

    #3 Rowan Griffiths, Feb 26, 2018
    1. PRO MEMBER PERKS Divi Block Pro - Premade mega menu design for your Divi site without using any plugins:View Demo
  4. Rowan Griffiths

    Rowan Griffiths New Member

    Do you need a login?
     
    #4 Rowan Griffiths, Feb 26, 2018
  5. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Apparently, it's a bit tricky to achieve what you want.

    First, add back the free-sticky CSS class to the logo section.

    Then, try to add this custom CSS:
    Code:
    Log In or Sign Up to view this code.
    Let me know if it works.
     
    #5 Divi.Help Pro Support, Feb 26, 2018
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Beautify your Divi archive / category page with 15 different premade blog designs:Learn More
  6. Rowan Griffiths

    Rowan Griffiths New Member

    Hi,

    It didn't work - tried fiddling with the css heights etc. See attached.

    The area with the logo etc also showed the rest of the page as it scrolled.

    Thanks
     

    Attached Files:

    #6 Rowan Griffiths, Feb 26, 2018
  7. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    I can't see the changes on your site. Can you clear your cache?

    And just to double confirm. You want this whole part to be sticky right?

    upload_2018-2-26_23-33-32.png
     
    #7 Divi.Help Pro Support, Feb 26, 2018
    1. PRO MEMBER PERKS Divi Block Pro - Premade gallery carousel design for your Divi site without using any plugins:View Demo
  8. Rowan Griffiths

    Rowan Griffiths New Member

    Hi,

    Yes the whole header - logo / contact / charity logo and the menu. But so the menu stays below the logo etc.

    I have put the code back on the header so you can see what it does.

    I cannot leave it on the site for very long while it is not working as the client has access to the url!

    Thanks
     
    #8 Rowan Griffiths, Feb 26, 2018
  9. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Nvm you can put it back to original. I'll look into it & see if there are other ways to achieve what you want.
     
    #9 Divi.Help Pro Support, Feb 26, 2018
    1. PRO MEMBER PERKS Divi Block Pro - Premade team carousel design for your Divi site without using any plugins:View Demo
  10. Rowan Griffiths

    Rowan Griffiths New Member

    Ok, thanks. Do you need a login to test it?
     
    #10 Rowan Griffiths, Feb 26, 2018
  11. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    #11 Divi.Help Pro Support, Feb 26, 2018
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Agency Divi layout pack featuring modern overlay archive blog layout with hover effects:View Demo
  12. Rowan Griffiths

    Rowan Griffiths New Member

    That has worked perfectly! Thank you!

    :)
     
    #12 Rowan Griffiths, Feb 26, 2018
  13. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Awesome!
     
    #13 Divi.Help Pro Support, Feb 26, 2018
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Custom Divi Builder header on desktop + default slide in / fullscreen menu on mobile:Learn More
  14. Petro

    Petro New Member

    hello whats the free sticky css ?? shud we use it and then use the code you guys provided
     
    #14 Petro, Mar 27, 2018
  15. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    @Petro

    The free-sticky CSS is to make the element stick to the screen when scrolling down. Usually it's only used for the menu.

    The CSS above is specific for the site. If you have any issue, kindly post a new thread: https://divi.help/forums/basic-support-forum.71/
     
    #15 Divi.Help Pro Support, Mar 28, 2018
    1. PRO MEMBER PERKS Divi Block Pro - Premade gradient text design for your Divi site without using any plugins:View Demo
  16. Petro

    Petro New Member

    hello there i need help i put the code and the Free sticky css on my logo part header but my menu rises above it wen i scroll
     
    #16 Petro, Mar 28, 2018
  17. Petro

    Petro New Member

    okay let me do that thanks
     
    #17 Petro, Mar 28, 2018
    1. PRO MEMBER PERKS Divi Block Pro - Premade gradient text design for your Divi site without using any plugins:View Demo
(You must log in or sign up to post here.)