1

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

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

火狐：

火狐

铬合金：

铬合金

即 7：

即 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; }

查询：

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

为什么IE讨厌我？

4

2 回答 2

6

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

td img {
    display:block;
}

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

于 2012-08-15T10:02:39.520 回答
0

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

于 2012-08-15T09:45:49.187 回答