Sticky bars menu links not aligned with text

Support
#1

I purchased Pro recently and I’m having some issues with my headers. I have a slightly modified sticky bar header which I’m planning to set up a newsletter opt-in that’s applied just to my home page. I have another header applied to all of my other pages I’ve modified it from the template even more by getting rid of the top bar and keeping just the bar with the logo and the menu.

The problem that I’m having is on the pages where I have the other header without the first bar, the clickable area of the menu links no longer stretch from the bottom of the bar to the top, it stops just below the text. I’ve found that I can change the bottom margin for the navigation under design to -2.5 as somewhat of a quick fix. However, the clickable area still doesn’t reach the top of the bar like it’s supposed to. How can I fix this?

Link: http://reject-icons.com/about/

Thanks in advance!

#2

Hello There,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks.

#3

I thought I was very clear in my first post. I’m not sure where you got confused, but I’ll try my best to better explain. In the header that I am using on all of my pages except for my home page, the navigation links are not clickable. You have to click just under the link text to click the link. I want the link to be clickable on the text and anywhere above it and below it (within the header bar). I can post screen shots if it’s really needed, however, I provided a link. All you have to do is go there and hover the mouse over the navigation link text in the header to see what the issue is. Thanks.

#4

Hello There,

Thank you for the clarifications! I can confirm that the links are not clickable. You will have to hover below it before you can click on it. Upon inspection, the height of the menu item is just 3 pixels. This could be the reason why. Could you please adjust the height, padding and even margins and see how it goes. If nothing else works out, please give us access to your WP dashboard so that we can take a closer look how you have setup the navigation settings.

Thank you for your understanding.

#5

Thanks for the suggestions. The element that you saw that was 3px in height was the hover particle. I messed around for hours with all kinds of settings including height, margin, and padding like you suggested, both in the header creator and in css, and I couldn’t figure it out. Then I realized that the top of the clickable area was exactly inline with the bottom of my Bar 1 which holds my off canvas content area and it’s toggle. So I changed the height of Bar 1 to 0px and then in css I made the top margin of the off canvas content area’s toggle to 70px to reposition it. That seems to have solved the problem. Thanks a lot for your help!

#6

Glad you’ve sorted it out and sharing the solution with us.

Cheers!