IE9 img悬停在底部添加边距 [英] IE9 img hover add's margin to bottom

问题描述

我遇到了一个非常奇怪的问题，对如何解决这个问题一无所知.发生问题的网页上有一个div，其中有几个水平可单击的图像.当鼠标悬停在可点击的图像()上时，15像素的边框会更改颜色，而当鼠标悬停在悬停状态时，边框颜色会再次更改为原始颜色.奇怪的问题是，当我在div中悬停任何图像或保持悬停状态时，div下的边距会不断扩大，这当然是不可接受的. 仅在IE9中会出现此问题. Chrome和Firefox可以正常工作.我尚未在以前的IE版本上进行过测试. 我认为问题可能出在以下CSS语句中:

I'm having a very strange problem and have no clue on how to solve it. The webpage on where the problem occurs has a div which has several clickable images horizontal in it. When hovering the clickable images () a border of 15 pixels changes color, when leaving the hovered state the border color changes again to the original color. The weird issue is that when I hover any image in the div or leave the hover state, the margin under the div keeps enlarging, which is ofcourse unacceptable. This problem only occurs in IE9. Chrome and Firefox work fine. I haven't tested on previous IE versions. I think the problem might be in the following CSS statements:

#content_links #fotos #foto{
    text-align: center;
    width: 488px;
    overflow-y: hidden;
    white-space: nowrap;
    margin-left: 22px;
    margin-bottom: 70px;
}

#content_links #fotos #foto a{
    text-decoration: none;
}

#content_links #fotos #foto img{
    margin-left: 3px;
    margin-right: 3px;
    margin-bottom: 6px;
    border: 3px solid silver;
    border-bottom-width: 15px;
}

#content_links #fotos #foto a:hover img{
    border: 3px black solid;
    border-bottom-width: 15px;
}

有关解决此问题的任何线索?预先感谢，

Any clues on solving this problem? Thanks in advance,

托马斯

推荐答案

您是否已为html声明了文档类型?我注意到IE和无边界的奇怪事物.我不确定这是否适用于IE 9.

Have you declared a doctype for your html? I have noticed strange things with IE and borders without one. I am not sure this applies to IE 9.

有关CSS和与Internet Explorer的兼容性，请参见此处.

See here on css and compatability with internet explorer.

这篇关于IE9 img悬停在底部添加边距的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！