与TD的表和空白的IE错误？

我有一个使用表中的页面，在FF等工作完美，但在IE7它会导致问题，它基本上是四个角落有一个TD和IMG（其圆角形式）..如果我删除它修复了文档中的空白。实际上发生的事情是它弄乱了桌子..它在容纳2个角的上部tr和下一个tr之间放置了一条细白线，我需要删除在IMG和TD之间的空白，有没有更好的解决办法，因为我有很多，不仅如此，如果我重新格式化的问题返回文档..与TD的表和空白的IE错误？

下面是一个简单的例子..

<table width="100%" height="418" border="0" cellpadding="0" cellspacing="0" bgcolor="#F04A23" 
      style="margin: 0px; padding: 0px"> 
      <tr> 
       <td width="12" align="left" valign="top"> 
        <img src="content/images/corner_left.gif" width="12" height="12" /> 
       </td>

，你可以看到有IMG和TD之间的空白......所以它看起来像这样我将其删除：

<img src="content/images/corner_left.gif" width="12" height="12" /></td>

的问题消失了，（注意TD和图像是紧挨对方）

任何想法，我尝试设置各种CSS，填充0像素，边缘0像素等......

真的很感激任何想法。

来源

2009-06-14 mark smith

为“修复”（我用这个词松散）的唯一方法是remove the whitespace。

更重要的是，你应该停止做网站就像是2001年:)

来源

2009-06-14 19:29:36

是的，它是一个网站的编辑，它不会告发”我已经决定使用表格进行布局......但是目前它的所有内容都已经存在，直到我将其转换为...感谢您的回复.. – 2009-06-15 06:39:22

IE发现存在是TD（除图像之外）内的文本内容，因此它赋予其它的文本line-height。尝试设置TD的height和overflow: hidden。

来源

2009-06-14 19:28:38

它已经这样了，早在我的记忆，所有版本。

至于我自己，我从来没有发现的另一种方式不是将图像和TD在同一行，但我从来没有真正看 - 有可能是我错过了一个办法。猜猜我刚刚养成了精简它们的习惯。

来源

2009-06-14 19:28:56 Eli

事实证明，删除空格不是解决它的唯一途径。其他人现在可能已经知道了这一点，但我想我会把它添加到这里以便完成下一个在这个令人讨厌的问题中遇到的可怜的灵魂。

基本上，你不必担心你的标记中的空白。相反，添加style =“display：block;”到img标签。由于图像是内联元素，并且在标记中有空白，因此IE会在单元格的底部添加额外的空白以说明带有分隔符的文本（例如g，y，p等）的可能性。将img标签设置为块元素来显示这一点。没有更多丑陋的空白！

幸得这个家伙：http://blog.wheelerstreet.com/ie-white-space-issue-with-td-and-img-solved，这是我找到了答案。猜猜他是从谷歌讨论组或其他人那里得到的。

希望有帮助！

来源

2010-03-17 18:48:03

这真棒！谢谢！无需再与空白区争斗！ – tdgtyugdyugdrugdr 2013-05-13 11:45:58

，我已经修复表的末尾之前添加此：

<tr> 
<td height="0"><img src="pixel.gif" width="0" height="0" alt=""></td> 
</tr>

希望这有助于。

来源

2011-03-01 18:43:40 Federico

我尝试了上述所有的解决方案：

一个）尝试了显示：块

b）中除去白空间在TD标签（即我用tr和TD标签没有白色空间其间它们）

。

三）我尝试使用：

padding:0px;border-spacing:0px;border-style:none;border-collapse: collapse;margin:0;overflow: hidden;

溶液A）工作。解决方案b）和c）不适用于IE。

但是我发现最好的解决办法是这样的：

添加hspace=0属性的图片标签。例如：

<img src="http://www.printersrose.com/css/myimages/book1.jpg" alt="Header1" class="ImageHeader" hspace="0" />

这是诀窍。

来源

2011-04-12 09:11:32 David

其他（并且最好:)）的解决方案是：

设定图象设定的TD宽度/高度与图像宽度/高度与CSS来的背景为TD

像：

<td style='width: 12px; height: 12px; background: url(corner-left.gif) no-repeat;'></td>

它可以形成我:)

（对不起，我的英语：“>）

来源

2011-05-13 14:40:10 Briganti

另一个迟到的反应，但你也可以用line-height: 0;删除空格。为确保文本仍然可读，您可以将其包装在另一个元素中，并使用line-height: normal或您选择的其他值。

td * { line-height: normal; }

来源

2011-08-03 11:18:24 Fre

这驱使我坚果一会儿 - 移动从IE 8.0到IE 9.0在Intranet站点 - 所有图像突然有了它们下面一点空白。

设置显示：图像上的块为我做了。

来源

2013-03-27 13:19:04

我有这个问题太与Internet Explorer中的Intranet站点，所以我关掉了兼容性视图模式Intranet站点来解决它：

来源

2017-09-07 05:30:40

与TD的表和空白的IE错误？

回答

相关问题