收藏
回答

input中的文字无法垂直居中

问题模块 框架类型 问题类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
API和组件 小程序 Bug input 微信iOS客户端 6.6.6 2.0.7

针对input的文字垂直居中,我单独做了个实验,重新编辑了此帖,存在于value 和 placeholder 是否有值造成的渲染差异,详细在代码片段中查看

麻烦官方看下,查下是否是渲染的BUG

@官方@官方@官方



最后一次编辑于  2018-05-19  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

10 个回答

  • 薛小丹
    薛小丹
    2018-05-21

    input 和textarea 都有这问题,而且line-height 是没有效果的



    2018-05-21
    赞同 11
    回复 1
    • fullAu
      fullAu
      2018-05-21
      +1,昨晚调半天,line-height确实没用
      2018-05-21
      赞同
      回复
  • 莫过于此
    莫过于此
    2018-05-19

    .operation .number {

    width: 60rpx;

    height: 40rpx;

    line-height: 40rpx;

    min-height: 40rpx;

    text-align: center;

    border: 0;

    background: transparent;

    font-size: 25rpx;

    color: #999;

    position: relative;

    z-index: 10;

    margin-top: -3rpx;

    }

    试一下

    2018-05-19
    赞同
    回复 3
    • 莫过于此
      莫过于此
      2018-05-19
      input 的line-height本来也是没用的,内部文字也是默认剧中的,你看到的下移,是你input处于父盒子中位置导致的,而且你的父盒子溢出隐藏所以给你的错觉,给input用margin值调一下就好了
      2018-05-19
      赞同
      回复
    • 任性༄
      任性༄
      2018-05-19
      我试了下,删除overflow这部分,其实,input的高度只有40rpx,不是应为overflow 的缘故造成的错觉,不加margin-top在真机 IOS中基本是居中的,不过聚焦的时候文字有下沉一丁点的微动、android中文字稍微偏上一点点,开发工具中就是截图的这样,错位太多,加上margin-top真机就真的错位太多,方法不可取
      2018-05-19
      赞同
      回复
    • 相信自己
      相信自己
      07-02

      官方什么时候修好这个bug啊

      07-02
      赞同
      回复
  • 任性༄
    任性༄
    2018-05-19

    @官方麻烦来看看

    2018-05-19
    赞同
    回复 1
    • 任性༄
      任性༄
      2018-05-21
      真的没人来回答么??@官方
      2018-05-21
      赞同
      回复
  • cunjinli
    cunjinli
    2018-05-31

    问题没有复现,你是什么机型?

    2018-05-31
    赞同
    回复 1
    • 相信自己
      相信自己
      07-02

      iPhone7puls 是居中的 iPhone7 以下的小屏不居中

      07-02
      赞同
      回复