IE8: Div hover only works when background color is set, very strange, why?

Question

Situation: Got a div with buttons images. Div needs to fadeIn on hover. Works in all browsers, except Internet Explorer. When I give the div a background co

Answer 1

My solution is to set a background color on the element you need to hover, then use the CSS opacity property to hide it. A fallback is provided for IE in the form of a filter.

.element {
  background-color: #fff;
  opacity: 0;
  filter: alpha(opacity=1);
}

This solution doesn't require a transparent PNG, and unlike the rgba solution it works in older versions of IE.