Hi Folks, had a good search on the forum and days of trying to sort this myself.
I have a menu but the active part that you click on is not the same height as the menu itself.
I have adjusted everything I can see but nothing works.
Link below shows the problem if you hover over the links the active area does not go all the way to the bottom.
Would like the active area to be the full height of the nav bar.
Any help would be very much appreciated please.
Not thoroughly tested
Try this, but notice that padding is edited, height and display properties are added.
#cssmenu > ul > li > a { border-right: 1px solid rgba(80, 80, 80, 0.12); color: #ffffff; display: inline-block; font-size: 14px; font-weight: 500; height: 100%; letter-spacing: 1px; padding: 40px 10px; text-decoration: none; text-transform: none; }
cheers,
gary
Tried and works better
Cheers Gary
Your solution worked, thank you.
Had to adjust the sub-nav to suit it but that wasn't hard, just a slight adjustment.
Thin white line below the menu
Not critical to page but would look better with a thin white line just undermea the menu.
Have tried adding bottom-border and the colour but doesn't work, any ideas?
Have you tried restoring A's
Have you tried restoring A's text-decoration? E.g. a {text-decoration: underline;}
?
I just did try it, and it is an improvement.
cheers,
gary