title: How do I ensure the correct control gets clicked when controls are overlapping?
body: <p>I am creating a number of transparent controls on a form which each display a hex shape, they are grouped as a map, so that the hexes are edge to edge. Of course each hex is contained within a square control, and so they overlap with each neighbor hex. I want to have able to click inside a hex to cause it to become highlighted. However, unless I would click in the middle of the hex where there is no overlap, depending on the stack order of the controls the click event would be picked up by whichever control is on top, not necessarily the control I want. So as I see it, I need to do two things:</p>
  
  <ol>
  <li>I need to ensure that the cursor is inside a hex shape (there is a small gap between the edge of each hex). So if I click in one of the corners of the control, that control would not respond to that click since its outside of the hex.</li>
  <li>When I click, I need to determine which control owns the hex I am clicking on.</li>
  </ol>