Mega Menu in Chrome and Safari

[PA.com]

Hello,

I am testing my website (http://www.piano-accompaniments.com/...est/index.html) and have noticed an issue with the MegaMenu when using Chrome and Safari which doesn't seem to exist in IE11 or FireFox.

Namely that Chrome and Safari seem to insert extra space between the lines, which I don't want as some of the dropdowns are 25 deep. I have attached the stylesheet code that is hopefully relevant to my MegaMenu, would someone be able to point out where in the code this issue might arise please.

Thanks,
Paul

[jont]

Not fully tested across other browsers as done on the fly in Chrome ... in the actinic.css look for

.navigation-bar li a

and change the "line-height" and "height" declarations to 20px ... works in Chrome but not seen what happens in IE/FF

[PA.com]

Thanks Jont,

Making those alterations does alter the spacing in Chrome while leaving IE unaffected. However it also seems to affect the height of the navigation bar itself, which I would rather not have. I think I can probably get round this by separately editing the .navigation-bar { lines and adding some margins and line heights in that section. I'll have a mess around and see what I come up with.

Thanks for your help, it's put me on the right track.

Paul

[peblaco]

You can target just the drop down links styles, there are a few such as: .navigation-bar ul li div ul li a, a.dropheading, a.droplink

[PA.com]

Ah, right, those are further down the style list past the Megamenu syles. Excellent, that can be my next port of call to try!

Thanks very much,
Paul