In a page I have a drop down menu (in the #header div) and a h2 title (in the #content div, which is separate from the #header div). Somehow, adding "position:relative" to the h2 will break the layout of the drop down menu.
The issue: The clickable area of some of my menu links (but only the first level links! Second level and h2 links worked just fine…) did not include the link’s padding. So the clickable area was very small even though the hover effect worked in the entire area.
The solution: make sure the link has "HasLayout=true". Here is a demonstration of the influence of HasLayout on clickable areas. An easy way to fix it is to set the height of the offending item to 1%. In my case:
#primary-nav li a { width: 1%}