HTML / CSS - 图像链接仅适用于图像的一半

Question

我有一个图像缩略图，文本位于图像的右侧。我在弹出全尺寸图像的图像上有一个超链接。

现在超链接只适用于图像的下半部分（在文本嵌入图像的下方）。

奇怪的是，它似乎在 jsfiddle 上工作正常，但在网站上却没有。

有什么可能导致这个问题吗？下面的 JSFIDDLE 正是它在网站上的样子。

http://jsfiddle.net/EJvm2/1/

CSS：

    .content {
        width: 500px;
        padding: 10px;
        overflow: hidden;
    }
    .content img, .content h3 {
        float: left;
        border-style:solid;
        border-width:5px;
    }
    .content img {
        padding-right: 10px;
    }
    .content p {
        padding: 40px 0 0 20px;
    }

HTML：

    <div class="content"> <a id="image1" href="images/site_images/acorn-award.jpg" title="image title.">
            <img src="images/site_images/thumb.jpg" alt="" width="200" height="120" />
        </a>

    <p>This is some text explaining the image</p>
</div>

Answer 1

页面上的其他地方覆盖了链接的一部分。您可以通过右键单击不起作用的部分并在您使用的任何浏览器中选择“检查元素”或其等效项来找出它是什么。