问题描述
修改 input 的高度不生效
设定 input 高度 18px 实际显示为 25.19 px
审查 input 组件默认 min-height 值为 1.4rem 修改 min-height 值后 input 组件外部高度虽然趋向正常,但 placeholder 显示会错位。
查看框架内部样式 wx-input,wx-input div,wx-input input 设定的 min-height 为 1.4rem 应该是错误的,正确的值可能是 1.4em,另外 wx-input div,wx-input input 不应该写 min-height 为固定值。
问题截图
实际高度错误:
修改后 placeholder 错位(在真机还会导致文字上下滚动):
审查开发者工具发现内部 input 实际高度错误:
代码
< input placeholder = 'input' ></ input > |
input{ font-size : 12px ; line-height : 18px ; height : 18px ; background-color : #cccccc ; } |
麻烦提供能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)
已经提供:https://developers.weixin.qq.com/s/qmxkA7mg7l94
真机上会吗?
我这边测试安卓真机上也有问题,但表现不同:获取焦点后文字不能垂直居中,用手触摸能上下滚动。
代码片段:https://developers.weixin.qq.com/s/XlDOI7mJ7d9H
这没影响到什么吧,谈BUG说不上,主要看你预期表现是什么,像如下代码我觉得就已经满足我的预期了
<input placeholder='input' placeholder-class='pc'></input>
input{
font-size: 12px;
line-height: 18px;
height: 18px;
min-height:18px;
background-color: #cccccc;
padding:5px;
}
.pc{
color: #ff0000;
}
确实是 Bug,只修改 min-height 值会导致内部 wx-input 元素内部的元素错位
你有没有注意到截图里的 placeholder 偏上(真机上还能上下滚动)