0

我正在做一个项目，当你将它悬停时，你应该点击它。它在所有浏览器中都能完美运行。但由于某种原因，它在 IE 中不起作用

现场演示：http:
//jewelbeast.com/imghover/rounded.html

HTML：

<div class="vertical-smallborder">
    <section>
        <img src="http://placehold.it/400x600" />
        <div class="text">
            <span>
                <h1>This is a title</h1>
                <p>This is an example of a description.</p>
                <p>The entire image is a link!</p>
                <a class="entire" href=""></a>
            </span>
        </div>
    </section>
</div>

CSS：

div.vertical-noborder section span a.entire{
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
}

我希望有人知道这个问题。

4

1 回答 1

3

您的代码肯定比它需要的更复杂——除非有某些原因您需要绝对定位元素，否则您不应该这样做。

我相信您在 IE 中的代码中有两种不良行为：

  1. Margin-left: -250px在 div 中将元素推到屏幕外
  2. 的z-index元素是把img上面的a标签。（链接）

与其尝试修复 IE 中的这些错误，不如重写您必须img在a标签中包装的内容。

于 2013-08-12T17:31:00.077 回答