html - Chrome 中 HTML 元素之间的额外空格

Question

更新 [2015 年 5 月 4 日]：似乎最新版本的 Chrome (42.*) 已修复它。

它看起来像一个令人尴尬的简单问题，但我不知道它的解决方案。重现这一点的最小样本之一是以下 HTML 代码：

<html><body><input type="button" value="button1"/><input type="text"><input type="button" value="button2"/></body></html>

请注意，以上任何地方都没有使用换行符或空白字符（分隔属性除外）

在 Firefox 中，它看起来像这样：

在此处输入图像描述

但是在 Chrome 中是这样的：

在此处输入图像描述

请注意 Chrome 决定自行添加的额外空白。我已经尽我所能，但无法删除它，因为我不需要这些元素之间的空间（或者可能是像 FF 一样的简约值）。

关于我们如何做到这一点的任何帮助？

谢谢 ...

score 1 · Accepted Answer

尝试重置您的 CSS，http://www.cssreset.com/。如果您不重置某些 DOM 元素，则它们具有特定于浏览器的布局值。

score 1 · Accepted Answer

一种选择是重置 CSS 中的样式。

您可以将其添加到默认样式表中。

* {
padding: 0;
margin: 0;
}

如果您需要有关重置的更多信息，这里有一个很好的运行：http: //perishablepress.com/a-killer-collection-of-global-css-reset-styles/

score 0 · Accepted Answer

我注意到在源代码中添加新行通常会在选择标签中添加空格。如果您喜欢可读的源代码，这将非常麻烦。当然，您不需要在源代码中添加新行，但不应该这样。这是 Chrome 中的一个错误。

3 回答 3