Question

我在IE7上遇到了很多问题，但这次IE8做的很奇怪。

下一段代码不起作用：

<style>
.inschrijven{ display: block;  width: 460px;  height: 150px; background: url("image.png") no-repeat 0 0;}
.inschrijven:hover{background-position: bottom;}
.inschrijven span{display: none;}
</style>

<div style="text-align:center;">
<a href="#" onclick="pageTracker._trackEvent('samenstellen', 'click', 'track');" class="inschrijven"><span>Schrijf u hier in</span></a>
</div>

我无法点击该项目，它不会翻转。它甚至不在屏幕中心。我认为这是做正确事情的正确方法。

Answer 1

我认为因为这个css它是隐形的：

.inschrijven span{display: none;}

您已在链接中设置了<span>，但之后您已使用上面的CSS隐藏它，因此您无法看到它，因此无法点击它。

尝试删除CSS下方，然后看：

.inschrijven span{display: none;}

Answer 2

我找不到类似的情况，其他每个按钮似乎都在IE8中工作，但这是我的解决方案：

将范围留空。不需要空间，不要隐藏它。

为此范围设置填充，调整为图像尺寸：

.inschrijven span {padding:5px 230px 145px;}

Answer 3

我不确定你的问题是什么，它适用于我

虽然其他人已经注意到你的跨度是看不见的。 http://jsfiddle.net/F2XJs/2/

http://jsfiddle.net/F2XJs/3/让一切正常，并评论，它也可以在不使用跨度的情况下通过文本实现您的要求:)

CSS Rollover：悬停图像不会在IE8中滚动

3 个答案: