Custom CSS for main menu and position of main menu question

[Green thumb]

Hi there.

I need to change main menu’s css so it will look something like in the attachment.
First I have to position it a little bit lower in the header and secondly I have to create some kind of a button effect with purple background.

Can you please give me advice how to do that?
1) How do I position menu a little bit closer to body?
2) WHat CSS code do I have to hack in order to achieve effect of buttons?

Thank you in advance!

[Cosmin – SUPPORT]

Hi,

For 2) – that requires advanced customizations that theme support cannot cover. I suggest hiring a freelancer to do it.

For 1) – Custom CSS :

#main-navigation {
  margin-top: 10px !important;
}

Adjust the 10px value as needed.

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[Green thumb]

Hi Cosmin,

Thank you for your reply,

I have another question about positioning menu, question 1)

Is it possible to position it under the logo? And make it in the middle of the page? Or would I need for that advanced CSS coding?

[Green thumb]

Cosmin it’s me again 🙂

I’ve played with your code and if adding enough number of pixesls like this:

#main-navigation {
margin-top: 10px !important;
}

Menu is already lower then the logo.

Now I just have to move it in the center or on the left so I used margin-right option

#main-navigation {
margin-top: 140px !important;
margin-right: 335px !important;
}

This will placed menu in center of the site and lower then the logo. But I couldn’t put it under logo even if I’ve increased margin-right pixels as if there would be some invisible space around logo.

In attachement there is 335px.png which shows somehow centered menu and 336px.png which shows menu that is not bellow logo instead it collapses in another column.

Is there a relatively easy way to move menu under logo? Left sided?

[Cosmin – SUPPORT]

I would suggest editing the container classes in header.php so that the logo container is bigger (ex class=”span6″) and it forces what is to the right of it (menu) to break on the next row, underneath it.

Regards,
————————————————————————————————————

Cosmin
Support Assistant