webkit浏览器中输入元素的垂直填充无效

Question

我无法为输入元素中的text / placeholder设置垂直/顶部填充。

以下代码适用于IE / Firefox / Opera，但不适用于Safari / Chrome：

CSS：

input
{
 border: 1px solid black;
 height: 100px;
 padding: 70px 25px 10px 25px;
 width: 300px;
}

HTML：

<input type="text" placeholder="Enter text here"/>

webkit开发人员工具按原样显示指标，但文本仍在输入的中间。

类似的东西可能是here（尽管没有答案）。

Answer 1

刚刚测试了Chrome和Chrome的行为方式。你可以把输入放在div中并使用填充吗？

Answer 2

输入是内联元素。内联元素不接受垂直填充。

将<{1}}添加到您的CSS中，然后您必须添加display:block并在之后清除您的花车。

Answer 3

我相信没有办法在Webkit中设置垂直填充。

使用height属性添加垂直填充。您可能需要使用line-height或padding-top / padding-bottom来跨浏览器垂直居中。