Safari输入文本忽略填充顶部

我有一个问题，在输入文本框中Safari中忽略填充顶部。 Chrome，Firefox或IE都不会出现此问题。我创建了一个JS小提琴显示问题：Safari输入文本忽略填充顶部

如果您查看此琴在Chrome中，你可以看到，填充机顶正确呈现。但是，如果您在Safari中查看此提琴，则会忽略填充顶部，并且光标默认放置在输入的垂直中心。

出于某种原因，默认情况下，Safari似乎在输入中垂直居中文本。当在源RenderTextControlSingleLine在http://opensource.apple.com/source/WebCore/WebCore-514/rendering/RenderTextControlSingleLine.cpp寻找它：

// 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的或类似的东西来覆盖此行为。

来源

2012-04-06 David Silva

我不相信你可以重写这个行为，但是你可以使用类似http://jsfiddle.net/Xrpwn/7/（饶恕污点）和捕获输入的javascript事件来模拟相同的效果：焦点/模糊添加/将大纲删除到容器div。

来源

2012-04-06 19:26:54

好的，我希望避免这样做，但进一步思考我认为这可能是最好的解决方案。有人知道为什么Safari不会改变他们的代码来匹配所有其他浏览器设置的标准吗？无论如何，我更新了JS小提琴，以添加带有一点jQuery的UI焦点阴影。 http://jsfiddle.net/Xrpwn/8/感谢您的帮助。 – 2012-04-09 15:11:35

这可能是为了防止人们试图做你喜欢的事情=）输入标签用于捕获用户输入，而不是真的用于包含标签等其他元素。在div中包装标签和输入（即使您将div设置为'看起来像一个大输入字段'）将成为您的最佳选择。 – 2012-04-09 16:56:20

Safari输入文本忽略填充顶部

回答

相关问题