为什么IE8在我的图片锚标签上添加底部边框？ [英] Why does IE8 add bottom border on my image anchor tag?

问题描述

我知道，这很可悲，但IT只是在今天早上在我的机器上安装IE8。直到蝙蝠我遇到了一个明显的问题，我搞砸了太长时间，即使我知道答案是盯着我在脸上。

I know, it's pathetic, but IT just got around to installing IE8 on my machine this morning. Right off the bat I came across a glaring issue and I've messed around with it for too long even though I KNOW the answer is staring me right in the face.

首先，这里是网站： www.mchenry.edu
在IE8中查看并将鼠标悬停在顶部横幅图片上 - 看到一切向下移动？这是一些类型的文本装饰或边框问题，但我不知道哪些。在我们的测试环境中，我甚至试图通过

First off, here's the website: www.mchenry.edu View it in IE8 and hover over the top banner image - see everything shift down? It's some type of text-decoration or border issue but I can't figure out which. In our test environment, I even tried to get real specific with

#banner p#img a:hover {text-decoration: none};

但这不会做任何事情。更令人讨厌的是，我不能让它出现在IE6，7或FF，或Safari，或Opera等。头。反对。台。

But that doesn't do anything. And what's even more annoying is that I can't get it to show up in IE6, 7, or FF, or Safari, or Opera, etc. Beating. Head. Against. Desk.

感谢您可能有的任何洞察。

Thanks for any insight you guys may have.

推荐答案

， 让我们来看看。

Okay, let's see. This is where the developer tools come in handy.

使用开发人员工具，我将鼠标悬停在图片上，并激活了点击选择功能，因为它维护了错误。我点击了这个小区域，突出显示了现在的高度为128的< p id =img>。

Using the developer tools, I hovered over the image, and activated the "click to select" feature, as this maintains the "error". I clicked on this small area, and it highlighted the <p id="img">, which now had a height of 128.

/ em>将p扩展两个像素，并编辑源以删除< a>消除了问题，所以清楚，在那里有东西干扰它。我没有看到什么，它不帮助，我似乎不能影响那个小盒子的颜色。

Something is expanding the p by two pixels, and editing the source to remove the <a> removes the problem, so clearly, something in there is disturbing it. I'm not seeing what, and it doesn't help that I can't seem to affect the color of that small box.

但是，我们可以做更多：我们可以淘汰CSS的部分。我从Records.css逐个删除CSS规则，当a：hover被删除，问题消失了。更深入，从那里删除背景颜色，它停止了！

However, we can do more: we can yank out parts of the CSS. I removed the CSS rules from Records.css one by one, and when a:hover was removed, the problem went away. Going deeper, removing the background-color from there, it stopped!

所以，一个简单的解决方法是分配< a>元素新属性：style =background-color：transparent。

So, a simple fix is to assign the <a> element a new attribute: style="background-color: transparent".

请注意，我没有使用任何其他浏览器或版本测试这个，但我不能请参阅影响其他浏览器的规则（以差的方式）。

Note that I didn't test this with any other browsers or versions, but I can't see that rule having affecting other browsers (in a bad way).

这篇关于为什么IE8在我的图片锚标签上添加底部边框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！