Drupal:IE 兼容性问题

Question

我在使用 Drupal 6 创建但在 IE 中不兼容的站点时遇到问题。熟悉 Drupal 的任何人是否介意快速浏览一下该网站，如果您有任何疑问，请告诉我？

http://freespiriteurodesign.com.b1.bloomsite.net/

这可能是一个 css: "hover"、 "float"或 "display"问题，但真正让我困惑的是，这些图像看起来像是彼此相邻重复了一次 - 让我解释一下，(有六张图像总共有三个覆盖前三个以创建悬停效果)在 IE 中看起来总共有 12 个(图像及其覆盖重复)，这就是为什么它将 float 图像推到彼此下面。它在 firefox 中正确显示，如果它有助于查看那里应该看起来像什么的话。我整晚都在寻找任何论坛上的类似问题，但没有遇到任何问题。

我只是想，也许非常熟悉 Drupal 的人可能会认为它看起来像他们以前处理过的东西，并给我一个起点......

附言。 (哦，是的，我想弄清楚实际问题是什么，而不仅仅是使用将网站置于兼容模式的标签)-感谢您的所有想法!

Answer 1

好的，在查看您的源代码后，我发现您在 anchor 标记内嵌套了 div，我认为这是您的问题，因为它不是有效的 HTML:

<a href="/design">
    <div class="desgn_bx">...</div>
</a>

相反，以相反的方式嵌套 div 元素，这样您的 HTML 如下:

<div class="desgn_bx">
    <a href="/design"></a>
    <!-- rest of your content -->
</div>

然后添加以下CSS:

.desgn_bx {
    position: relative;
}

.desgn_bx a {
    *background-color: inherit;   /* add these for IE7 as it does */
    *filter: alpha(opacity=10);   /* not like boxes with no content */
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
}

这将强制 anchor 标记占据 .desgn_bx 元素的完整高度和宽度，因此它仍然可以点击。