收藏
回答

input中的文字无法垂直居中

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

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

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

@官方@官方@官方



最后一次编辑于  2018-05-19
回答关注问题邀请回答
收藏

5 个回答

  • 小程序运营专员 - cunjin
    小程序运营专员 - cunjin
    2018-05-31

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

    2018-05-31
    有用
    回复 2
    • 相信自己
      相信自己
      2019-07-02

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

      2019-07-02
      回复
    • 「完成」好过「完美」
      「完成」好过「完美」
      2020-01-27
      iphone6 和6s也有类似的问题,只不过是文本不能水平居中,应该是一个BUG。样式设置如下:
      .number {
          width: 50rpx;
          height: 38rpx;
          text-align: center;
      }
      2020-01-27
      回复
  • 丹丹妹儿
    丹丹妹儿
    2018-05-21

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



    2018-05-21
    有用 1
    回复 1
    • Au
      Au
      2018-05-21
      +1,昨晚调半天,line-height确实没用
      2018-05-21
      回复
  • Hao
    Hao
    2020-10-14

    搜索到这里来了... 18年的 现在也还有这个问题????

    2020-10-14
    有用
    回复 1
    • 词旧
      词旧
      星期四 11:07
      2021了还是有这个问题
      星期四 11:07
      回复
  • 任性༄
    任性༄
    2018-05-19

    @官方麻烦来看看

    2018-05-19
    有用
    回复 1
    • 任性༄
      任性༄
      2018-05-21
      真的没人来回答么??@官方
      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
      回复
    • 相信自己
      相信自己
      2019-07-02

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

      2019-07-02
      回复
登录 后发表内容