IE 7在桌面上增加了额外的高度

Question

我试图找到为什么IE增加了额外的空间。这是一个临时图像，唯一的静态数据是图像宽度（171像素）。

使用Jquery我提醒div高度，在Firefox，Chrome和Opera中，div高度为164px，但在IE 7上它有172个！

火狐：

铬：

IE 7：

HTML：

<div class='wide-box'>
            <table border="0" cellspacing="0" cellpadding="0" width="171">
                <tr><td height="7"><img src="images/wide-box-header.png" width="100%" alt='' /></td></tr>
                <tr><td class='y-repeat'><img src="images/temp/3.png" alt=''/></td></tr>
                <tr><td height="9"><img src="images/wide-box-footer.png" width="100%" alt='' /></td></tr>
                <tr><td class='shadow'></td></tr>
            </table>
        </div><!-- WIDE BOX -->

CSS：

.wide-box{
    display:block;
    width:171px;
    float:right;
    margin-right:10px;
}

.wide-box .y-repeat img { display:block;margin:0 auto; }
.wide-box .y-repeat { background:url(images/wide-box-y-repeat.png) top left repeat-y; }
.wide-box .shadow { height:10px;background:url(images/wide-box-shadow.png) top center no-repeat; }

Jquery的：

$(window).load(function(){
    $(".wide-box table").height( $(".wide-box .y-repeat img").height() + 24 );
});

为什么IE讨厌我？

Answer 1

我实际上看到Chrome和IE9中的间距。没有看到完整的例子我不能确定，但​​添加

td img {
    display:block;
}

删除了本地测试中行之间的间距。

Answer 2

添加以下css重置脚本：http://meyerweb.com/eric/tools/css/reset/  应该使IE，Chrome和Firefox做出更加一致的反应