Html Div类：悬停在IE中无法正常工作

请使用Internet Explorer查看下面的链接

似乎当我试图将鼠标悬停在声明的div类上时，

：hover

不能正常工作，但在chrome中它工作得很好。知道为什么吗

请只提供CSS解决方案

下面是CSS编码

#f12{
    width: 400px;
    height: 30px;
    left: 470px;
    top: 1090px;
    position: absolute;
    background: transparent;
    opacity: 1;
    filter: alpha(opacity=0);
    float: left;
    border-width: 1px;
    border-style: inset;
    z-index: 99999;
}

#f12:hover ~ #floater{
    background:url(images/flavours/f12.jpg);
    width: 320px;
    height: 320px;
    opacity: 100;
    top: 30%;
    left: 0%;
    filter: alpha(opacity=100);
    float: left;
    position: fixed;
}

#f13{
    width: 100px;
    height: 50px;
    left: 550px;
    top: 460px;
    position: absolute;
    background: transparent;
    opacity: 1;
    filter: alpha(opacity=0);
    float: left;
    -webkit-transition: 1s all;
    -moz-transition: 1s all;
    transition: 1s all;
    border-width: 1px;
    border-style: inset;
}

#f13:hover ~ #floater{
    background: url(images/flavours/f12.jpg);
    opacity: 100;
}

#floater{
    width: 320px;
    height:320px;
    opacity: 0;
    position: fixed;
    left: 0;
    top: 30%;
    filter: alpha(opacity=0);
    float: left;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -ms-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    border-width: 1px;
    border-style: inset;
    filter: alpha(opacity=100);
}

---

您有两种doctype，第一种是错误的，将IE置于怪癖模式。只需删除它们并使用这一个：

您使用的是什么版本的IE？我还看到您将#flotter作为两个独立ID（f12和f13）的子项引用。在多个位置的同一页上是否有id为“flotter”的元素？这会很糟糕，因为ID应该是唯一的。大家好，我使用的是IE9，而且，#flotter是一个固定的位置，页面中只有一个该元素的实例..看起来背景是透明的；对于#f12和#f13使其不可选择，您有什么解决方法吗？我将其更改为黑色，当我将鼠标悬停在其上时，浮动框显示为旁注，您可以通过将菜单从.png（821kb）转换为80%压缩的.jpg（221kb）来大幅提高页面速度，而且外观上没有明显的损失。你的主页幻灯片和任何你有照片的地方也是如此。哦，上帝，真的吗？我只在header.php中声明了一个doctype！我把它改为“仅”而不是“均匀”：悬停不起作用=（您仍然显示不正确的doctype。请将我显示的doctype单独放在那里。好的，rob，我在页面模板中将其更改为，但它似乎无法正常工作。是的，它现在可以工作了！谢谢！但是原始问题没有解决，我如何使其可选择？