Centering logo and menu

I'm trying to figure out how to center the logo and main menu at the top of the page. I figured out how to move the menu under the logo with some custom css but I'm unable to center everything.

Hi,
How to use firebug , read here ---> http://www.gavick.com/documentation/joo ... -size-etc/

For sure you have to disable almost all floats start from this :

Code: Select all

#gkMainMenu {float:none;   }

but...
You can always request support from us, but you need take in your mind that customization is not regular Template support.

I set all the floats to none and I can move the logo and the menu around by adding margins but I can't get anything to center. I've tried a lot of scenarios using firebug but no luck there either.

could you add here visualization how it must be , use simple graphic tool - it will help me help you more.

But of course you know that those changes can crash a little mobile version.

Here is a screen shot

And where is URL.

Second possibility it to modify code closely in : gk_creativity\layouts\default.php

Here is a link

http://wezworldtest.com/agnes/

I am able to add left-margin padding to the Logo and Menu to center them but that doesn't help when you click learn more links on the front and get inside the site where the Menu is different.

Well it's been a week now

Sorry for late response - Pawel is on a vacation break.

I see you have already made some css changes with override.css.

To center the image add this at the end of override.css:

Code: Select all

.gkLogo {
width: 100%;
}
#gkLogo.cssLogo {
width: 100%;
background-position: 50% 0;
}


To center the menu add this code:

Code: Select all

.gkMenu > ul {text-align: center;}
.gkMenu > ul > li {float: none; display: inline-block;}


Excellent that worked perfectly. Thanks!

No problem, I'm glad I could help.