Sydney menu div hover

Hi there,

Would first of all like to thank you for such an amazing theme! I am truly amazed and it seems like i am not the only one. Great job! I have recently been working on a website with the Sydney theme and would need some help figuring out a good way to change the menu hover system a bit. Currently the hover only works for the text link only, changing the color of the text. I would however like the hover to affect the div background color as well: similar to the website provided here:

I am not interested in the sub-menu but only the hover effect of the menu background. I have been experimenting a bit with the css, changing the background color of the link divs - however, this only seems to create rectangles around the links rather than stretching the entire div to top and bottom of the menu frame, so simply not like the example above. How would I go about to achieve this?

All help is greatly appreciated and once again, thanks for an amazing theme! It is prominent that you have spent many hours working with it!

Kind regards,



I guess this could be done but you would need to match the height of the menu items to the height of the menu bar. Post a link to your site so I can see what you have so far please.

I also really like.
Please help us to solve the problem.
For a new site on the themes Sydney PRO made portfolio.
It is necessary, that would be when the mouse on the image to be seen the name of the project, (as the themes PERTH
I hope to help.

More, I little changed the plugin, but I am afraid that this is not correct
I wish so too -

@Любовь Серебрякова: Looks like you managed to display the title.

The menu thing wouldn’t work well in your case because you have two many items and they go on two rows. This type of approach only works well with a few top level menu items.

Thanks for the very fast response Vlad! I have not yet uploaded the site and have been working on it on a wamp server. I will however upload it later today and will provide you with a link once it’s up. Thanks again and we all really appreciate your help, truly!


What should I do? Client only need to inscriptions. He is willing to buy the theme, but probably will be in to buy

Not really sure what you’re saying. As I mentioned, if you want an effect like on the site you linked, your menu needs to contain less items. It’s pointless otherwise.

I ask your help - you need a portfolio on all pages of the filter and the words - and your customer will be. Ready to buy or Sydney or another but with these features

Hi all, I would like to show, as on the sites yo mentioned above, the caption on the roll over of the images in the portfolio. How can I do this? I’m using Sydney of course. Many thanks.

Dear Vlad,

Sorry for the late reply. I have finally uploaded the website and it can be found here:

I hope this can give you an idea towards how I could possible achieve the hover effect I wanted on the menu.

Hope to hear from you soon, keep up the good work!




This would do it:

#mainnav ul {
    margin: 0;
    overflow: hidden;
.site-header {
    padding: 0;
.header-wrap .row {
    margin: 0;
#mainnav li {
    padding: 30px 14px;
#mainnav li:hover {
  background-color: #000;
.site-logo {
   margin-top: 15px;

Adjust as needed.

Thanks for your fast response Vlad!

That seemed to work fine but with some minor issues. Is there anyway i could keep the way the menu currently works when someone scrolls? With the changes you’ve mentioned, once I scroll, instead of the menu becoming smaller, it becomes bigger.
Also, when hovering across the menu when not at the top of the page, the menu background gets a margin from the div, both at the top and bottom. I wouldn’t mind having the hover effect disabled when not at the top of the page, much like the dikka theme website i linked earlier. Hope all of this makes sense.

Thanks once again! and please do take your time with responses if your busy as I am not at all in a hurry to solve this.

Kind regards,