如何在 UC 浏览器 Mobile 上垂直对齐输入元素的占位符？答案

【问题标题】：How do I vertically align placeholder for an input element on UC browser Mobile?如何在 UC 浏览器 Mobile 上垂直对齐输入元素的占位符？
【发布时间】：2017-04-25 21:52:51
【问题描述】：

我的问题是特定于浏览器的。我的 css 在移动设备上的 UC 浏览器中无法像在其他浏览器中那样正常工作。

我想在中心垂直对齐占位符。但令我惊讶的是，垂直对齐似乎有点偏离。

这是我从 UC 浏览器截取的屏幕截图

这是我的小提琴Open in UC browser的链接

这里是 UC 浏览器的链接：UC Browser Android

UC Browser for Ios

我已经应用了以下 css

.date-input {     
    padding: 8px 30px 8px 36px;
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
}

&lt;input type="text" class="date-input" placeholder="Hello World"&gt;

请帮忙

【问题讨论】：

我认为你可以使用填充来调整它。
@athimohan 我在 UC 浏览器上检查了 facebook 网站，登录输入文本字段显示相同。 :(
尝试使用em 单位设置行高。

标签： css mobile cross-browser

【解决方案1】：

只需使用 em 代替像素...

.date-input {     
    font-size: 1em;
    font-weight: 400;
    line-height: 1.35em;
    outline: none;
    padding: 0.57em;
}

【讨论】：

我希望它对你有帮助，我的朋友 :-)