Logo in sticky header

Hi there, 

when I use sticky header the logo is going smaller. 
Is there a way to set a special size or that the logo is not so small? 

Please look at the page and the logo in the sticky menu


Thx for help!

Comments

  • Hi,

    to increase logo in sticky header, please use:
    #Top_bar.is-sticky #logo img:not(.svg) { max-height: 75px !important; }
    #Top_bar.is-sticky #logo { padding-top: 0 !important; margin-top: -10px !important; }
  • THANK YOU. THIS IS AWESOME! 
  • Having the same problem - please look at "kylebethdev.wpengine.com" 
  • The above CSS didn't work =/ we are looking to simply increase the sticky header size - as you can see from the site above - it is incredibly small. Scoured through the forums but couldn't find anything that worked!
  • Hi,
    You do not have a sticky header. Please change the header style.
    thanks
  • Good day Support
    Is there a way to keep the menu aligned middle of the header after adjusting the size of the sticky header and logo. Link: http://dupaint.co.za
    The menu jumps position on scroll because I've adjusted the height of the header. Please help. Thank you in advance and in future for your awesome theme and updates to come.
  • Please make your logo smaller, it's too big that's why it's not middle assigned.
    You can change height of it in:
    BeTheme > Theme Options > Global > Logo
    Set the default height and vertical padding.
    Also, set Vertical Align to middle.
    Thanks.
  • Hi Pablo, Thank you for your prompt feedback…
    Oh, how I wish you knew how I want the logo smaller. Not my call, unfortunately.

    Previously, the header was fixed and that worked fine, however, because the slider was appearing behind the menu, I had to change the header to 'classic'. If I return it to 'fixed', how can I prevent the menu from overlapping the slider?
  • Please use this Custom CSS code instead
    #Top_bar.is-sticky .menu_wrapper{
    padding-top:2.5%;
    }
    Thanks
  • Good day Pablo

    Firstly thanks for your responce ealier. I've resorted to changing the header style to fixed. New problem has arisen:

    So, I used below CSS to make the logo bigger on mobile, however, part of the logo disappears behind the banner, Is there a way I can make the header adjust to the increased size of the logo, ie, increase the header size to accommodate the bigger logo?

    CSS:

    @media only screen and (max-width: 959px) {
        #Top_bar .logo #logo img { max-height: 100px !important; }
        #Top_bar #logo { height: 100px !important; }
    }

    Link: (on mobile)


    Pretty please help Pablo… Thank you
    ps: I'm on fixed header style, so I'm hoping the mobile version will display like the desktop which is fixed.
    When scrolling, the logo is fine, but not so before scrolling? 
  • Hi,
    Check this:

    @media only screen and (max-width: 767px) {
    #Top_bar{
    height:130px !important;
    }
    }
  • edited June 2018
    Thanks Pablo

    Worked perfectly.

     A new problem on the mobile view has arisen from the recent changes though:
    1. The search field needs to move down below the header
    2. The menu when clicked also needs to display below the header so it's not sitting atop the logo

    Save me, thanks…

  • 1) I don't know what you mean "move down below the header"
    It cannot be, because it'll be under hamburger menu(when clicked) and it'll make problems.

    2) Paste this CSS code

    @media (max-width:767px){
    nav#menu{
    margin-top:60px !important;
    }
    }


    Thanks
  • edited June 2018
    Pablo, you're legendary!
    You are rated 10 stars by me for your awesome support.

    So, I've fixed request #2.

    What I meant with request #1 is that the search field appears atop the logo and not below the header…
    See screenshot: http://prntscr.com/jzwf8s

    Lastly, how can I ensure the responsive header is fixed and doesn't move on scroll?

  • edited June 2018
    After all this changes we cannot do it.
    There will be space all the time, leave it as it is.
    It's just a search menu.
    Cheers
  • Thanks for all the other help, appreciate it…
Sign In or Register to comment.