0

我有以下风格：

  background-color: #C9C5BC;
  color: #FFF;
  font-size: 10px;
  font-weight: bold;
  padding: 0 3px;
  text-transform: uppercase;
  cursor:pointer

HTML 元素是

<span class="name-indicator">NameIndicator1</span>

它看起来像 Firefox（需要）

在此处输入图像描述

在 Chrome 中它看起来像这样（错误）

在此处输入图像描述

问题是在 chrome 中 span 元素之间没有空白，这是由于在 FF 中高度为 13px 而在 Chrome 中为 15px，当将 chrome 中的字体大小设置为 7px 时，我达到了正确的效果。

如何在两个浏览器上解决这个问题？我想保持字体大小为 10px

编辑：

我创建了一个小提琴，请看一下 FF 和 Chrome

4

2 回答 2

1

我注意到codesstackoverflow 中的答案看起来与您提供的图像（第二张）相似。如果将此 CSSline-height: 21px放在容器上.wmd-preview p，则代码之间会出现分隔符。所以你的问题可以通过将 line-height 添加到那些span.

于 2012-05-23T12:17:41.973 回答
1

为了有更好的机会在许多浏览器中获得相同的结果css-reset，请在页面的开头使用。这段 css 将确保所有元素在所有浏览器中都具有相同的默认值。你可以从这里得到一个。

于 2012-05-20T09:12:42.480 回答