[tem]

Hi!
double click on the button... you will see tree states:
the first is the normal state: what you see without mousing on it..
the second is the over state: the state where you drew the yellow square.
the third state is the active area: the area where you want to enable the mouse.

in your case the second and third state are the same so the mouse is captured even in the yellow square area.
all you've got to do is to copy the first state in the last button state so the active area will be just the red square.