Customizing top horizontal menu

[dco]

Hi, I need some help on customising the top horizontal menu. I'm trying to centralise the whole menu, trying to achieve like what picture #3 is (see attached picture). I've tweaked the superfish-modified.css file here and there but ended up with #1 and #2 (on hover) in the picture. The alignment between the menu is not continuous. Anyone knows how can i make the whole home button length to be highlighted when the mouse hovers it instead of partially like in picture #1?

 

I'm also attaching the css file for anyone to check.

Thanks!

 

superfish-modified.css

[NemoPS]

Hi,

You need to have the sf-menu>li>a set to display block, with a 100% width. Then, the sf-menu>li items must be wide as a percentage of the menu, depending of the number of items. Say, you have 4 items, every li must be 25% wide

[dco]

Do i have to create the sf-menu li a, because i can't seem to find it.. Sorry noob question

[NemoPS]

it should already be in superfish-modified, but if you can't find it then yes, add it

[androkot33]

I don't know if this is what you looking for but take a look at screenshot below.

[dco]

Hi androkot33,

 

Not quite actually. From your screenshot, imagine if the searchbar on the header is not there, then the menu (as in the word 'Home', 'Ipod', 'Accessories') would still be aligned to the left. I'm looking to centralize the whole menu on the header like picture #3 in my image attached earlier.

[miriama]

Hi dco,

I have the same your issue, did you solve it?

 

Thanks,

regards

Miriam