Html Div悬停规则在IE10中不起作用

这是我的第一篇文章。我还在学习CSS，非常感谢你的帮助

我一直在尝试创建一个Div，其中包含一个底部带有半透明边框的透明覆盖图像。悬停时，将添加第二个透明覆盖，使底部边框更暗。然后我有另一个包含一些标题文本的div，标题文本应该在父div中悬停的任何地方改变颜色，并且整个内容在单击时链接

最接近它的是Vimeo：

我已经成功地实现了所有这些，它在IE、Firefox和safari等中运行良好。但是在IE10中，文本在悬停时不再改变颜色，div也不能点击

以下是我的CSS：

.videoCatThumbImg {
    position:relative;
    background:#FFFFFF;
    width: 178px;
    height: 178px;
    padding: 5px 5px 5px 5px;
    margin: 10px 0px 0px 0px;
    border: 1px solid #CCCCCC;
    line-height:normal;
    float:left;
}   

.videoCatTskin {
    position: absolute; top: 5px; left: 5px;
}

.videoCatThumbHover {
    position: absolute; top: 5px; left: 5px; display: none;
}

.videoCatThumbImg:hover .videoCatThumbHover{
    display: block;
}

.videoCatTitle {
    position:absolute;
    top:5px; left:5px;
    display:block;
    width:173px;
    height:26px;
    padding:152px 0px 0px 5px;
    Font-size:18px;
    font-weight:bold;
    color: #ffffff;
}

.videoCatTitle:hover {
    color: #5798ca;
}

这是我的HTML：

<div class="videoCatThumbImg">
    <img src="http://www.mydomain.com/images/vcat/image_thumb.gif" alt=""/>
    <img class="videoCatTskin" src="http://www.mydomain.com/images/vcat/thumb_hover.png" alt=""/>
    <img class="videoCatThumbHover" src="http://www.mydomain.com/images/vcat/thumb_hover.png" alt=""/>
    <a href="http://www.mydomain.com/category/356"><div class="videoCatTitle">Some Text Here</div></a>
</div>

---

任何关于我做错了什么的建议都是非常受欢迎的。

类似于，尝试向没有背景的hover类添加背景（透明图像或相同颜色可以使用）。

.videoCatThumbImg:hover

）。所有解决方案都不起作用（边框、背景、布局）

---

最后，我切换到了XHTML 1 Strict doctype，它成功了，如果它能帮助…

您通常不会将块级元素（

）放在内联元素（

）中。我知道您正在寻找特定于CSS的解决方案，但我建议您采用jQuery方法。用文本隐藏div，并使用jQuery显示/隐藏文本元素（不透明度）。你介意发布问题的详细信息吗？hi Lokasi-我曾尝试为其添加背景色，但没有效果。嗨，斯派克。如果没有div元素，我将如何实现同样的效果？