我正在研究一个内部网应用程序,该应用程序多年来一直致力于所有主流浏览器中的怪异模式.目标是让它在标准模式下工作而不会破坏任何东西,以便我们可以使用一些jQuery包.无论如何我的问题是在标准模式下,当单元格内有iframe时,Firefox和Chrome会向表格单元格添加2px底部填充.这不会发生在IE中.
当我切换到quirks模式时,填充在Firefox和Chrome中消失.
当我添加div而不是iframe时,填充消失了.
将表cellpadding和cellspacing设置为零无济于事.
iframe src页面也处于标准模式.
这是一个测试用例,供您查看：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head><title>Test</title></head>
<body style="background:#FFF;">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id='browser_td' style='width:1000px; height:500px; margin:0px; padding:0px; background:#000; border-bottom:0px;'>
<iframe id='browser_iframe' name='browser_iframe' src="http://houston.craigslist.org/" width='1000' height='500' frameborder="0" hspace="0" vspace="0"></iframe>
</td>
</tr>
</table>
</body>
</html>
解决方法
将vertical-align：top添加到iframe. vertical-align的初始值是基线.
iframe是内联元素.有问题的差距是以字母为descenders保留的空间.
更多信息：https://developer.mozilla.org/en/Images,_and_Mysterious_Gaps
原文地址：https://www.jb51.cc/html/223774.html
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
