Css IE8-导航链接不工作

嘿，大家好，我一直在谷歌上尽可能多地搜索这个，但我所做的一切似乎都无济于事

我一直在一个网站（www.philipdukes.co.uk）上工作，虽然导航在FF、Safari、chrome甚至IE6（奇迹般地）中都能正常工作，但在我的系统上，导航链接在IE8中却失败得很惨：导航链接无法工作

我将鼠标悬停在它们上，获得滚动动画，但它们不可“单击”。它们是基本的文本链接，文本在屏幕外对齐，然后它们所代表的区域应该是可点击的。填充空间的图像不是链接。如果删除图像，我可以单击该区域；如果删除文本对齐，我可以单击链接文本（但仅限于链接文本）

这让我快发疯了，因为这是我在所有事情都充分发挥作用之前需要解决的最后一件事

导航栏的代码如下所示：

    <div class="navHolder">
    <div class="nav current-home">
        <div id="home"><img src="images/nav/home.png" alt="home." /><a href="index.html">home.</a></div>
        <div id="bio"><img src="images/nav/bio.png" alt="biography." /><a href="bio.html">biography.</a></div>
        <div id="media"><img src="images/nav/media.png" alt="media." /><a href="media.html">media.</a></div>
    </div>
    <div class="nav2 current-home">
        <div id="press"><img src="images/nav/press.png" alt="press." /><a href="press.html">press.</a></div>
        <div id="pdr"><img src="images/nav/pdr.png" alt="plane dukes rahman trio." /><a href="pdr.html">Plane Dukes Rahman Trio.</a></div>
        <div id="contact"><img src="images/nav/contact.png" alt="contact." /><a href="contact.php">contact.</a></div>
  </div>

您缺少：

.nav a, .nav2 a  {
    left: 0;
}

这应该可以解决问题。使用

位置：绝对时，始终设置垂直（
顶部
或
底部
）和水平（
左侧
或
右侧
）位置

更新

只要设置了
背景
，它就会按预期工作。通过大量测试，您可能会找到解决问题的不同方法。但我会这么做：

最佳方式：

要么去掉
img
标记，要么隐藏它们，而是将它们作为
背景图像
应用于
a
标记
将
a
标记上的
位置
更改为
相对
，而不是
绝对
，因为它们将是父
div
的唯一可见子项
快捷方式

.nav a, .nav 2 { background: url(/images/shim.png) }

其中
shim.png
是一个8位完全透明的单像素png。8位PNG填隙片小于相同尺寸（1像素）的gif，所有内容仍将按计划工作。
为IE8提供与IE7相同的样式，然后将以下元素放入文档头中：

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />



这将使IE8模仿IE7。因为你对IE7没有任何问题，我想这对你来说是可行的。
不完全确定那里发生了什么，但链接和图像元素的分层似乎有某种问题（可能是IE8的错误）。当我将
.nav img、.nav2 img
的
z-index
更改为任何负值而不是50时，链接就可以点击了

不过，我不确定在这种情况下这是否可行，因为负z索引可能会导致图像不再可见。
然后当IE9出来时，您必须为此添加另一个，然后当IE10。。。IMO，这不是一个很好的解决方案。即使在兼容模式下运行他的页面也无法解决问题。IE7没有提供特定的样式，该工作表只适用于除8之外的所有其他版本，@dcneiner是对的，它也无法解决问题……好的，现在有两个建议的解决方案。这两种方法都可以使用，这是我在IE8中使用开发工具测试的第二种方法。太棒了，谢谢dcneiner：我现在使用快速方法，直到我可以使用更好的解决方案为止！非常感谢大家的快速响应。您的快速解决方案在我的案例中也完美无瑕。这一定是IE8、IE7的z-index相关错误，因为其他浏览器（Chrome 4、Opera 10.51、FF 3.6、Safari 4.x）都没有这样的问题。太棒了！谢谢道格的这个解决方案@sheam89，你解决了吗？我在我的最新项目中做手风琴般的导航时遇到了同样的问题。这真是太痛苦了，我无法切换到背景图像，因为我使用img来拉伸背景梯度。它确实隐藏了图像，这是实际的“家庭”“媒体”等图像。
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />