在IE 8中，href链接无法正常工作

Question

我就是想不通。除了IE8浏览器，下面的链接在其他所有浏览器中都能正常工作。如果在IE8中点击这个元素，按钮会消失。如果你再次点击原来位置，它会重新出现。但是无论如何点击都无法跳转到href链接。是否有人可以解释一下为什么会这样？我已经考虑过所有可能性，但还是不行。非常感谢你们的帮助！

HTML代码...

<div style="padding:0px 0px 30px 0px; clear: both;">
 <div style="width: 50%; display: block; float: left;">
  <a href="../index/features" class="big_button">Learn More</a>
 </div>
 <div style="width: 50%; display: block; float: left;">
  <a href="../index/signup" class="big_button">Get Started</a>
 </div>
</div>

...和样式表...

 .big_button {
-moz-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
-webkit-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
box-shadow: inset 0px 1px 0px 0px #bbdaf7;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #79bbff
    ), color-stop(1, #378de5) );
background: -moz-linear-gradient(center top, #79bbff 5%, #378de5 100%);
filter: progid : DXImageTransform.Microsoft.gradient (           
       startColorstr = '#79bbff', endColorstr = '#378de5' );
background-color: #79bbff;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
border: 1px solid #84bbf3;
display: inline-block;
color: #ffffff;
font-family: Arial;
font-size: 18px;
font-weight: bold;
padding: 15px 45px;
text-decoration: none;
margin-left: 130px;
}

.big_button:hover {
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
 background: -moz-linear-gradient(center top, #378de5 5%, #79bbff 100%);
 filter: progid : DXImageTransform.Microsoft.gradient (startColorstr = '#378de5', endColorstr = '#79bbff' );
 background-color: #378de5;
}

.big_button:active {
 position: relative;
 top: 1px;
}

- DrNoFruit

---

盒子阴影在旧版本的IE中存在问题。尝试以下链接以获取可能的解决方案：http://www.useragentman.com/blog/2011/08/24/how-to-simulate-css3-box-shadow-in-ie7-8-without-javascript/ - Vincenzo Maggio

有趣，我不知道那个。不幸的是，即使我在CSS中删除所有对盒阴影的引用，链接仍然无法工作。 - DrNoFruit

Answer 1

这是因为你的CSS中有'filter:'部分，移除它，然后它就可以工作了...

- PHPcoder

Answer 2

我刚刚弄清楚了。IE8似乎在CSS中有一个:active的问题。因此，样式表的以下部分会引起问题：

.big_button:active {
  position: relative;
  top: 1px;
}

目前的解决方法是在按钮的CSS中排除':active'部分，因为它并不是必要的。如果有人对IE8为什么会出现问题有更多的信息，我很感兴趣了解。

- DrNoFruit