IE8 Standards mode: onclick handler on div does no

Question

In my application I have a row of buttons (for BBcode) that is included in various places. Each button is an empty div with fixed dimensions, a background image and an onclick handler. This has worked very well in all browsers - so far.

Now I have added one more instance of this row, but this time it is inside an absolutely positioned pop-up div. (At least that's the one notable difference that I can think of, because otherwise it's the exact same code.) This also works in all browsers except for IE8, where clicking the buttons does not do anything. Unless I switch on compatibility mode, in which case it works pretty much fine.

Isn't there any other way to make Internet Explorer behave like it should?

Answer 1

I've found the solution. It was the "float:left" attribute on the buttons that made it fail.

Which is rather strange because in all the other places where this code was included, it also had the float - and it worked. Even in IE8.

Anyway, removing it and using "display:inline-block" for the placement did the trick.

Answer 2

I had the same problem in IE8. The transparent areas in the DIVs were not clickable. An easy solution is to set the background-image to a transparent .gif.

My solution in CSS:

background-image: url("images/pixel.gif"); 

...where pixel.gif is a 1x1 transparent image.