IE CSS Bug: background-color: transparent se comporte différemment à l'arrière-plan-couleur: (toute autre couleur)

J'ai eu du mal à trouver la raison de cette substitution n'est pas de se comporter comme il se doit dans IE8.

Rendez-vous ici: http://baked-beans.tv dans IE8, vous verrez que le roulement ne fonctionne que sur la moitié inférieure de l'image.

Btw, ce n'est pas activée par une <a> tag, mais par un :hover pour la <div>.

Ce que je n'arrive pas à comprendre est pourquoi il fonctionne uniquement sur la moitié inférieure de la div, en dessous de l'image, mais pas sur l'image (l'image n'est pas z-indexé, donc c'est pas la question)

Dès que j'ai du changer background-color à quoi que ce soit d'autre à part transparent, ça marche à 100%. Donc ce juste souffle mon esprit... pourquoi la moitié inférieure, mais pas la moitié supérieure, et seulement lorsque j'ai mis bg-transparence des couleurs?! Gotta love Internet Explorer.

Cela fonctionne comme il se doit sur toutes les autres navigateur (l'ensemble du carré agit comme un roulement)

Voici le CSS:

.cat_rollout {
    position: absolute;
    float:left;
    top:0;
    left:0;
    min-height:274px;
    min-width:274px;
    font-size: 0;
    background-color: transparent;
}

.cat_rollout:hover {
    background-image: url(images/rollover.png);
    min-width:254px;
    min-height:242px;
    padding-left: 20px;
    color: white;
    font-size: 21px;
    font-weight: normal;
    line-height: 24px;
    padding-top: 34px;
}

OriginalL'auteur RGBK | 2010-10-22