3

我的页面上有三个主要元素。两个跨度和一个输入字段。

所有三个元素都具有相同的填充和字体大小,但输入字段比两个跨度高一个像素(在 Firefox 中)。它在 Chrome 中看起来非常好。

这个“错误”可能是因为我正在使用谷歌网络字体,但我想知道你们认为问题是什么。

这是小提琴在 Chrome 和 Firefox 中打开并比较!

我试过了:

vertical-align: top; (middle, and bottom)
max-height: 50px;
line-height:;
overflow: hidden;

我还尝试更改输入字段上的字体大小,然后修复了 Firefox 中的问题,然后问题出现在 Chrome 中......它永远不会结束!

4

4 回答 4

4

也许您应该在元素上使用固定高度,而不是依靠填充和字体大小来计算高度:http: //jsfiddle.net/sN7aH/

#amount {
    font-size: 18px;
    background-color: #fcfcfd;
    font-family:'Montserrat', sans-serif;
    color: #bbc2cb;
    float: left;
    width: 312px;
    height: 50px;
}

我在 ff 和 chrome 上使用它没有发现任何区别

于 2013-07-15T03:03:04.940 回答
2
.enter-price {
    max-height: 50px;
}

需要强制允许的高度量。问题解决了。

于 2013-07-15T03:03:16.277 回答
0

使用检查器查看每个浏览器对元素应用的默认样式。然后你可以相应地重新设计。

于 2013-07-15T02:54:05.640 回答
0

最新的 Firefox 版本发生了变化。它现在使用与 Internet Explorer 11 相同的填充。我猜这是一个错误,现在得到了修复。但我在更新日志中找不到错误修复。

但是这种行为从 Firefox 26(我更新之前的最后一个版本)中没有左右填充和在 Firefox 29 中(就像在 IE11 中一样)的两侧都有默认的 1px 改变了。

有人可以为此指出一些更改日志的链接吗?谢谢!

于 2014-05-06T13:03:15.483 回答