Responsive menu on Droid phones

HTML & CSS
1

I have made this WordPress site using a child theme of Twenty Twelve.

Overall it works good. I have seen a problem with the responsive navigation on two separate Droid phones. When you toggle the navigation menu open - it opens and displays, BUT - the navigation links cannot be tapped/clicked. The click target box that shows up when you tap a link is not directly over the link. It is just above the link, so the menu links are not clickable because of this vertical misalignment.

If I revert to the WP Twenty Twelve theme the problem goes away, so I know the problem is with the css in my child theme. I just cant seem to find out where or how to correct this. I’ve tried all kinds of adjustments to the menu li margin-top and etc. but I just can’t get it fixed.

Any help or advice for trouble shooting will be greatly appreciated.

2

By deleting style sheet rules I was able to isolate the problem to a specific rule. I then discovered that a line-height value for the list item “a” elements was the culprit. So - problem resolved. Now on to the next little glitch <g>.

3

Glad to hear that you found the culprit. Thanks for sharing what you found.