我在 Chrome 中遇到了一个奇怪的 CSS 间距问题（但在 Firefox 和/或 IE 中没有）
Firefox 中“房地产搜索”（H2 标签）和“旧金山，CA ”（#city-field 输入标签）的表单输入字段之间的垂直间距是完美的，但在 Chrome 中，Chrome 正在应用更多/额外的垂直间距超过预期。
为了提供帮助，我附上了截图。红线表示 Chrome 添加的 Firefox/IE 没有的额外间距。
为什么 Chrome 比 Firefox 和 IE 应用更多间距的任何想法。
以及如何解决这个问题。
提前致谢
更新
我还使用“重置样式表”在所有浏览器中标准化 H2 间距等。它可以在我上面链接的 HTML 文档中找到，但仍然遇到这个问题。
根据 Web Inspector，在 Chrome 中，您的输入标签有 2px 的顶部和底部边距。但是，在 Firefox 中，Firebug 没有显示相同输入的余量。在您的 CSS 中使用以下内容：
#city-field {margin:0}
编辑：由于输入设置为 display:inline-block，导致额外的间距。如果将其更改为 display:block，您会注意到空格消失了。尝试使用浮点数和 display:block 来获取内联内容。
使用重置样式表。
不同的浏览器以不同的方式解释 H1、H2、UL、LI 等标签的 CSS 规则。这些包括填充和默认字体大小。重置样式表会采用所有这些并删除默认值，以便您可以在需要时替换自己的值。
我认为线高是罪魁祸首。尝试将 h2 的行高设置为 13 到 15 像素左右。默认情况下，它设置为正常。根据W3C， line-height: normal “告诉用户代理根据元素的字体将使用的值设置为“合理”的值。” Firefox 和 Chrome 可能会设置不同的“合理”值，因为它们建立在完全不同的渲染引擎上。