谷歌浏览器似乎忽略了 cellpadding + cellspacing答案

【问题标题】：Google Chrome seems to ignore cellpadding + cellspacing谷歌浏览器似乎忽略了 cellpadding + cellspacing
【发布时间】：2011-11-11 18:11:42
【问题描述】：

我有一个带有 tr 和两个 tds 的表。第一个 td 包含一个输入（文本），第二个包含另一个输入（图像）。第二个输入应该是一个按钮。我已将 cellpadding 和 cellspacing 设置为零，以便可以附加文本输入和图像按钮，中间没有空格。这适用于 IE 和 Firefox，但不适用于 Chrome。 Chrome 一直在文本输入和按钮之间留出几个像素的空间。我尝试使用 CSS，但似乎没有任何效果。知道 Chrome 的问题可能是什么吗？

<head>
<style type="text/css"> 
.search{ 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    font-size: 14px; 
    font-weight: normal; 
    color: #4D4D4D; 
    border: 1px solid #CCCCCC; 
    height: 21px; 
    outline: none; 
} 
</style> 
</head> 
<body> 
    <table cellpadding="0" cellspacing="0"> 
        <form method="post"> 
            <tr><td><input type="text" size="30" class="search"></td> 
            <td><input type="image" src="button.gif" name="submit" id="submit" width="77px" height="21px"></td></tr> 
        </form> 
    </table> 
</body>

【问题讨论】：

"尝试使用 css" 您是否正确重置了填充/边距？（在表格单元格和输入上）
有一些代码可以给我们看吗？
@weber，编辑您的原始问题以添加您正在使用的未正确显示的代码。注释绝对不是代码的地方。

标签： css forms google-chrome button html-table

【解决方案1】：

首先，您需要将<form> 标记移到<table> 之外，这样会给自己带来麻烦。

接下来，您需要将 tds 上的填充设置为 0：

form td {
    padding: 0;
}

这应该消除您看到的任何额外间距。

【讨论】：

【解决方案2】：

stackoverflow 用户said:

刚刚提到 cellpadding 和 cellspacing 已过时，当 Google Chrome 23 不支持它时，我感到震惊。

反正我在网上找不到任何参考资料！

【讨论】：

【解决方案3】：

你想要什么，通过css在桌子上试试border-collapse: collapse。

此外，您可能想研究其他方式，因为如今使用table 进行布局并不是前进的方向，听起来这就是您正在做的事情。

【讨论】：

请详细说明not the way forward these days好吗？
@BobSort 我会说使用 CSS 进行布局是前进的方向。使用<table> 在页面上布局元素是人们在前端开发的黑暗时代曾经做过的事情。
据我了解，这是您的个人意见。我并不是说这是对的或错的。我还没有找到关于为什么不应该使用表格来安排内容的有力参考。据我所知，css3有一些样式可以安排columns中的内容。
这是我个人的意见，但我想它或多或少是基于某些东西:) 在这种情况下，使用正确的工具来完成正确的工作。当然你可以用足够大的螺丝刀敲钉子，但这并不能使螺丝刀成为锤子。
@Matijs 您模糊的提示和隐喻对于像我这样仍在 2016 年找到您的答案的用户来说并不是特别有用。也许您会很友好地使用相关资源更新您的答案以支持你的意见是based on something？它的依据是什么？