Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #163993

    Hi there,

    My site is disruptivevision.com and I need to reduce the height of the header. I’m using the Sticky header with social icons and additional navigation. I thought it would be fairly easy but i can’t figure out how to reduce it. I want the header to be just a little bit larger than the what it is when it’s reduced after scrolling.

    Could you help out with this?

    Thanks

    #164184

    Hey disruptivevision!

    Your site is inaccessible but here’s the code you need to add to the css/custom.css file or to the Quick CSS section:

    #header_main .container, .main_menu div > ul > li > a{
    height: 62px !important;
    line-height: 62px !important;
    }
    .fixed_header.social_header #main{
    padding-top: 93px;
    }

    Cheers!
    Josue

    #164296

    Hello, I used the code to adjust the ‘padding’ of the header, but it doesn’t make my menu height shorter.

    http://optizign.info/optizigntemp/

    password: hello12345

    #164309

    Hello!

    Please add following code to Quick CSS and adjust as desired

    .fixed_header #main { padding-top: 66px; }

    By default it is 88px

    Regards,
    Yigit

    #165064

    Hi Josue,

    Thanks for sending. I tried that code and it does the job but now when I scroll, the header doesn’t reduce and the logo doesn’t get smaller.

    What I am looking for is to reduce the height of the header when at the top of the page but still have it contract further when scrolling.

    Cheers

    #165432

    Hey!

    It doesn’t make smaller because it’s already small, however if you want to shrink it when scrolled you can use this code:

    .header-scrolled #header_main .container, .main_menu div > ul > li > a{
    height: 50px !important;
    line-height: 50px !important;
    }

    Change the two ’50px’ for the desired height.

    Cheers!
    Josue

    #166016

    Hi,

    The code given for header is working great thanks, how ever we are having the trouble with the logo size now.
    When we upload the logo in 343 width and 156 height it’s looking fine on the desktop but overlapping on the mobile. We uploaded a bunch of different sizes and found that 241 x 157 worked. The logo in the image is end to end horizontally but there is a lot of vertical space. This is ok but now the logo is too small, we tried increasing the width and expanding the logo in the image but that only seems to make the logo smaller.

    Please help out with this

    Cheers

    #166205

    Hello!

    Tried to login but its not working :)

    Best regards,
    Yigit

    #166382

    Hi Yigit, give me your email ID, i’ll send you the login info. Have sent it to Josue already.

    Cheers

    #166580

    Hi!

    Please check your inbox

    Cheers!
    Yigit

Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Change height of header’ is closed to new replies.