changing the cursor hot spot

**undone** · 08-17-2010, 04:11 AM

Greetings!

I am working on a site and am using javascript for a drop-down nav table that appears when hovered on. Here is the site:

http://favilla-designs.com/demo/northpole-option2/

When you hover over the consulting | products | training buttons under the rotating cube, the drop down table reveals some navigational links on the right side of the table. When you hover the cursor over the links, the cursor's "hot spot" seems to be at the bottom of the pointer rather than the top.

I don't have a clue how to fix this. Any help is greatly appreciated.

Kind regards,
-Kathy

**azoomer** · 08-17-2010, 10:24 AM

in the style.css line 617, you can try to change the padding-top and padding-bottom to margin-top and margin-bottom, like this

Code:

.nav-blue {
color:#5B77CC;
font-family:Lucida Sans,Arial,Helvetica,sans-serif;
font-size:14px;
line-height:24px;
margin-bottom:20px;
margin-top:20px;
padding-left:20px;
padding-right:20px;
}

I think/hope it will help.

**Beverleyh** · 08-17-2010, 10:43 AM

Paddings and margins are always the first things I check if positioning is off.

Its surprising what positioning/size "mistakes" you find if you systematically work through all the elements with padding and margins in your CSS.