移动端placeholder不能垂直居中解决方案

1.问题描述

问题如图：手机端placeholder文字偏上，垂直方向不居中，input光标显示偏上
解决IE下不支持placeholder属性

2.解决方案

css

 .phoneNumber input {

                width: 100%;

                font-size: .34rem;

                display: inline-block;

                -moz-box-sizing: border-box;

                box-sizing: border-box;

                font-family: PingFang-SC-Regular;

                border: 1px solid #68be4c;

                border-radius: .1rem;

                text-indent: .4rem;

                color: #333;

                padding: .16rem 0;

                float: left;

            }

html

```
<div class="phoneNumber">
<input type="text" placeholder="输入手机号码" />
</div>
```

3.成果

问题完美解决，placeholder文字完美居中，光标显示正常

原文地址：https://segmentfault.com/a/1190000015185065

巴特西

移动端placeholder不能垂直居中解决方案

1.问题描述

2.解决方案

3.成果

最新文章

热门文章