Tagged: 

Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • November 18, 2013 at 3:02 pm #190094
    guyco

    Hi,
    I can not reopen a closed issue – https://kriesi.at/support/topic/header-and-slider-distance/
    It seems that now the top bar does not shrink to the smaller size when scrolling the page.

    Thanks,
    Guy.

    November 18, 2013 at 10:40 pm #190327
    Yigit

    Hi guyco!

    The code Josue provided makes the header fixed in height. Please try removing it and check your header once again. Please flush browser cache after changes. Gap was removed when i checked your website. Let us know if you still have the gap after removing Josue’s code

    Cheers!
    Yigit

    November 19, 2013 at 9:44 am #190485
    guyco

    Hi Yigit,
    Once I remove Josue’s code, the gap is big again (although the scroll minify menu effect works)

    Here is the code as it is now:
    li#menu-item-3512 a {
    padding: 5px 10px;
    background-color: #0698d9!important;
    color: white!important;
    height: 30px!important;
    line-height: 20px!important;
    margin-top: 43px;
    border-radius: 10px;
    }

    .header-scrolled li#menu-item-3512 a {
    margin-top: 15px;
    }

    .home .fixed_header.social_header #main {
    padding-top: 12px; }

    Cheers,
    Guy.

    November 19, 2013 at 3:06 pm #190592
    Yigit

    Hey!

    Please refer to this post to decrease the height of the header https://kriesi.at/support/topic/change-logo-image-for-scrolled-header/#post-188003
    You can enter 100 or 90 instead of 200 there

    Cheers!
    Yigit

    November 19, 2013 at 5:48 pm #190665
    guyco

    Done that, but:
    1. It did not work, the gap is still big (I started with 100 as you suggested but got down to 50), on top of that, when scrolling the menu size stays the same and does not shrink.
    2. I am using the child theme, what will happen upon upgrade?

    :(

    November 20, 2013 at 5:25 pm #191006
    Yigit

    Hi!

    Have you tried flushing browser cache after making changes? I think that is the only way to reduce the height below main menu items if you would like to keep menu resizing feature. Can you apply changes once again and let us know so we can take a look at it?
    Optionally, you can add following code to Quick CSS if you would like to make the logo inline with main menu

    .logo img { margin-top: 20px; }
.header-scrolled .logo img { margin-top: 0; }

    Cheers!
    Yigit

    November 24, 2013 at 11:12 am #192451
    guyco
    This reply has been marked as private.
    November 24, 2013 at 11:20 pm #192644
    Devin

    Hey!

    Can you first try updating your theme files to the most recent version. That we we are on the same code base when trying to check for issues or giving out additional css.

    Cheers!
    Devin

    November 24, 2013 at 11:36 pm #192650
    guyco

    Done, updated to the latest.
    Same issues :(

    Thanks,
    Guy.

    November 24, 2013 at 11:39 pm #192651
    Devin

    Can you re-add in the slideshow on the home page so I can see the incorrect spacing live?

    November 24, 2013 at 11:42 pm #192652
    guyco

    No need for that, you can see the incorrect spacing now as well, let’s make sure we are talking about the same thing:
    The space from the top menu to the separator line below it where the menu item selection indication resides, is way too big.

    November 24, 2013 at 11:54 pm #192656
    Devin

    Okay, the height of the header is determined by the line height of the nav items so its a bit tough to just move them around within the header. I’m not sure if this is what you may be going for but you can adjust the overall height of the header with the following:

    .social_header #header_main .container, .social_header .main_menu ul:first-child > li a {
height: 100px;
line-height: 100px;
}
.fixed_header.social_header #main {
padding-top: 131px;
}

    This is just an example that is 16 pixels shorter than what you have now and can be adjusted as needed. The end result is less of a gap on the bottom of the whole header before the content starts.

    November 25, 2013 at 12:05 am #192658
    guyco

    Sorry :( It does not change the spacing I am talking about …
    See what I am referring to
    Spacing

    November 25, 2013 at 12:37 am #192675
    Devin

    Then it would just be:

    
#top .main_menu .menu li > a {
padding-top: 10px;
}
#top .header-scrolled .main_menu .menu li>a {
padding-top: 0;
}
    November 25, 2013 at 9:13 pm #193154
    guyco

    Added the code, cleared cache, does not help :(
    This is the current code:
    li#menu-item-3512 a {
    padding: 5px 10px;
    background-color: #0698d9!important;
    color: white!important;
    height: 30px!important;
    line-height: 20px!important;
    margin-top: 43px;
    border-radius: 10px;
    }

    .header-scrolled li#menu-item-3512 a {
    margin-top: 15px;
    }

    .home .fixed_header.social_header #main {
    padding-top: 12px; }

    #top .main_menu .menu li > a {
    padding-top: 10px;
    }
    #top .header-scrolled .main_menu .menu li>a {
    padding-top: 0;
    }

    November 25, 2013 at 9:27 pm #193158
    Devin

    You have the css incorrect in your Quick CSS:

    #top .main_menu .menu li > a {
padding-top: 10px;
}
#top .header-scrolled .main_menu .menu li>a {
padding-top: 0;
}

    It should be:

    
#top .main_menu .menu li > a {
padding-top: 10px;
}
#top .header-scrolled .main_menu .menu li>a {
padding-top: 0;
}

    The previous css is not needed.

    November 25, 2013 at 9:35 pm #193164
    guyco

    Thanks!
    The previous css is for setting the login button on the top menu, now it is not shown correctly :(
    Can we reduce the spacing even more?
    Here is the updated code:

    li#menu-item-3512 a {
    padding: 5px 10px;
    background-color: #0698d9!important;
    color: white!important;
    height: 30px!important;
    line-height: 20px!important;
    margin-top: 43px;
    border-radius: 10px;
    }

    .header-scrolled li#menu-item-3512 a {
    margin-top: 15px;
    }

    .home .fixed_header.social_header #main {
    padding-top: 12px; }

    #top .main_menu .menu li > a {
    padding-top: 10px;
    }
    #top .header-scrolled .main_menu .menu > a {
    padding-top: 0;
    }

    November 25, 2013 at 10:10 pm #193170
    Devin

    You could change it to something like this:

    li#menu-item-3512 a {
padding: 5px 10px !important;
background-color: #0698d9!important;
color: white!important;
height: 30px!important;
line-height: 20px!important;
margin-top: 55px;
border-radius: 10px;
}

    For future customization where it needs to be exact however you will need to look into a freelance developer. Typically this is not supported through the support forums but we will usually finish off something we start off with.

    November 25, 2013 at 11:25 pm #193195
    guyco

    Thanks, much appreciated!

  • Author
    Posts
Viewing 19 posts - 1 through 19 (of 19 total)
  • The topic ‘Reopen a closed issue’ is closed to new replies.