css - IE CSS 错误 : background-color: transparent behaves differently to background-color: (any other colour)

Question

我一直在努力找出为什么这种翻转在 IE8 中的表现不正常。

转到这里:http://baked-beans.tv在 IE8 中，您会看到翻转仅适用于缩略图的下半部分。

顺便说一句，这不是由 <a> 激活的标签，但由 :hover对于 <div> .

我不明白的是为什么它只适用于 div 的下半部分，图像下方，而不适用于图像(图像不是 z 索引的，所以这不是问题)

一旦我更改 background-color对于除了透明之外的任何其他东西，它都可以 100% 工作。所以这让我大吃一惊……为什么是下半部分，而不是上半部分，而且只有当我将 bg-color 设置为透明时？!一定要喜欢 Internet Explorer。

这在所有其他浏览器上都可以正常工作(整个方 block 充当翻转)

这是 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;
}

Answer 1

尝试伪造背景图像或将其设置为 blank.gif 而不是使其透明。

background:url(blank.gif);

参见 http://work.arounds.org/issue/22/positioned-anchor-not-clickable-ie6/