css - 如何在 UC 移动浏览器上垂直对齐输入元素的占位符？

Question

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

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

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

这是我的 fiddle 的链接 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;
}

<input type="text" class="date-input" placeholder="Hello World">

请帮忙

Answer 1

只需使用 em 而不是像素...

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