Html 文本缩进：-9999em不适用于IE9中的跨度元素_Html_Css_Internet Explorer_Sprite

Html 文本缩进：-9999em不适用于IE9中的跨度元素

html css internet-explorer

Html 文本缩进：-9999em不适用于IE9中的跨度元素,html,css,internet-explorer,sprite,Html,Css,Internet Explorer,Sprite,我对以下链接有问题：播放图像是一个元素，背景图像与css精灵一起使用当我将鼠标悬停在上面的图像上时，一切都很好（链接和css精灵）问题在于IE9，当光标悬停在css精灵（播放按钮）上时，精灵会返回到非悬停状态，您无法从内部单击链接（参见下图）如果有人知道为什么会这样，那就太棒了。这是我为它做的一个例子，但它不会重现问题我有以下html和css： html: 我猜这是由于文档的DOCTYPE存在问题，导致IE9以怪癖模式呈现文档。这就解释了为什么JSFIDLE不会重现这个问题。尝试在I

我对以下链接有问题：

播放图像是一个

元素，背景图像与css精灵一起使用

当我将鼠标悬停在上面的图像上时，一切都很好（链接和css精灵）问题在于IE9，当光标悬停在css精灵（播放按钮）上时，精灵会返回到非悬停状态，您无法从内部单击链接（参见下图）

如果有人知道为什么会这样，那就太棒了。这是我为它做的一个例子，但它不会重现问题

我有以下html和css：

html:

我猜这是由于文档的DOCTYPE存在问题，导致IE9以怪癖模式呈现文档。这就解释了为什么JSFIDLE不会重现这个问题。尝试在IE9中打开开发者控制台，并确保文档模式和浏览器模式都设置为IE9。如果这解决了您的问题，请确保您的DOCTYPE标记设置为HTML5，例如

<!DOCTYPE html>

哇，非常感谢。几周前，我在一个内部网站上遇到了一个怪癖模式的问题，我很生气，我没想到要检查它。本可以节省我很多时间的。这个DOCTYPE标签可以吗<代码>@nearyopprgrmr：你得测试一下，我不是DOCTYPE专家。我只是碰巧多次遇到这个问题：-）

#video-box-left{
    margin-left: 10px;
    margin-right: 20px;
    float: left;
    width: 210px;
}

.video-img {
    background-color: #EEEEEE;
    border: 1px solid #DDDDDD;
    margin-bottom: 5px;
    padding: 4px;
    width: 200px;
    height: 155px;
}

.video-text {

}

.video-play-q-left {
    background: url("../images/video-play-q-big.png") no-repeat scroll 0 0 transparent;
    background-position: center top;
    height: 50px;
    position: absolute;
    text-indent: -9999em;
    width: 50px;
    left: 100px; 
    top: 127px;
}

a:hover .video-play-q-left{
    background-position: center bottom;
}

<!DOCTYPE html>