我遇到一个问题，即 Safari 中输入文本框的顶部填充被忽略。在 Chrome、Firefox 或 IE 中不会出现此问题。我创建了一个 JS Fiddle 来显示问题:
如果您在 Chrome 中查看此 fiddle ，您可以看到 padding-top 已正确呈现。但是，如果您在 Safari 中查看此 fiddle ，padding-top 将被忽略，光标默认位于输入的垂直中心。
出于某种原因，默认情况下，Safari 似乎在输入中将文本垂直居中。在 http://opensource.apple.com/source/WebCore/WebCore-514/rendering/RenderTextControlSingleLine.cpp 查看 RenderTextControlSingleLine 的源代码时它有:
// For text fields, center the inner text vertically
// Don't do this for search fields, since we don't honor height for them
if (!m_innerBlock) {
currentHeight = innerTextRenderer->height();
if (currentHeight < height())
innerTextRenderer->setLocation(innerTextRenderer->x(), (height() - currentHeight) / 2);
}
我想知道是否有人知道如何使用 CSS 或 jQuery 或类似的东西来覆盖此行为。
最佳答案
我不相信您能够覆盖该行为，但您可以使用像这样的东西来模拟相同的效果 http://jsfiddle.net/Xrpwn/7/ (请原谅我的马虎)使用捕获 input:focus/blur 的 javascript 事件来添加/删除容器 div 的轮廓。
关于css - Safari 输入文本忽略顶部填充，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10048102/