IE9 img hover add's margin to bottom

问题

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,

Thomas