Question

I have the following code

<a href="http://google.com">
    <div style="float:left;">
        Test
    </div>
    <div style="float:left;">
        testing
    </div>
</a>

The link works correctly (clicking anywhere in the div navigates to the link) but in IE7 the div doesn’t appear to be clickable. When hovering over the div the cursor does not change to a hand.

The hover works as excepted in IE8, Firefox, chrome

My guess is that there is the usual ugly IE hack for this 🙁

Answer 1

a {
  display: block;
  background: #eee; 
  overflow: hidden; 
  cursor: pointer;
}

the link still works, even without the pointer changing, however IE7 does like it better if hasLayout is set to to true (overflow:hidden; which also contains the floats in other browsers), and then just tell it to have the right cursor.. it needs help 😉