Resize menu bar

Hi
I would like to resize the menu bar with smaller height.
I have added the following to CSS overwrite but not sure if it is the correct way to do it:
#gkMenuWrapper
{
height:46px;!important
}
.gkMenu > ul > li
{
height:46px;!important
}

thank you very much for your help

Could you please post an url to your site?

Hi
It's under development at the moment.
Please visit here:
http://goo.gl/JsS090

You could also add:

Code: Select all

.gkMenu > ul > li > a {
height: 46px;
line-height: 46px;
}


That will center text vertically within menu element.

Also moving "Sign up" button up will make it look better:

Code: Select all

#gkUserArea .button {
margin: 8px 0 0 5px;
}


That's great.
Thanks for your help

Is there anything else I can help you with regarding this topic?

Please close it.
Thanks a lot

Hi
I tried to resize the menu font size but couldn't get it working properly on Google Chrome.
Please see the image attached.
URL: http://goo.gl/utohUc

I added:
#gkMainMenu .gkMenu > ul > li > a { font-size:14px;}

It seems to work fine on Firefox and Safari.

Thanks

From what I see you have added this to override box instead of override.css file. Using the second one is much easier. Also - I don't see this declaration anywhere on the site.

HI
Thanks for your reply.
I did revert it back on Live site, that's why you didn't see it.
Please access this Dev site:
http://goo.gl/CRpovb

I put that css into the template's Custom CSS code.

From what I see it works in Chrome exactly same as in Safari and reduces menu item size to 14px.

Hi
That's weird.
As i'm using Chrome 39.0.2171.71 on Mac OS , Safari works fine
I have 1 user sent me the same screenshot and the menu breaks on his computer.
I have attached another one here and hightlight that word in red.

Please try setting 13px font size.

Hi
yes that works.
Why smaller isn't better ?

It looks like chrome has some issues rendering this font. With 17px and 13ps it renders better then with other sizes.