文本框内的文字没有垂直居中显示

登录

文本框设置了20PX的高度，里面的文字没有垂直居中显示如下：

而超链接里的文字是居中显示的，这个可以，不知道文本框怎么设置垂直居中，除非文本框的高度设置30PX，感觉有个框内默认的上下边距为5px导致这个小问题。

Eric.Liang · Eric.Liang

我一直以为你这是6.1的问题，原来是7.0的，下次标题里可以附带下版本号

7.0的这个问题是Grid Layout导致的，是bug。页面布局上的会有各种问题，目前功能还在开发中，都在修复中。
如果碰到了其他的问题都可以给我反馈哈

xiaoz · xiaoz

我的没问题啊

xiaoz · xiaoz

会不会是浏览器的问题

回复 · 13861900516

字体大小9再试一下看看

Eric.Liang · Eric.Liang

13861900516 发表于 2021-3-1 00:54
字体大小9再试一下看看

在页面中文本框元素里面dom有好几层，div里面包Div, div里面再包input
每一层都要居中，所以高度就会有小数，所以在居中的情况下就存在浮点误差
所以不同浏览器高度不一样，你会发现文字居中会有一点点变化，就是因为浮点误差导致的

登录 · 13861900516

可为什么同一行一个超链接里的文字是垂直居中的，而文本框里的不居中，有点难理解

Eric.Liang · Eric.Liang

本帖最后由 Eric.Liang 于 2021-3-1 10:50 编辑

13861900516 发表于 2021-3-1 10:26
可为什么同一行一个超链接里的文字是垂直居中的，而文本框里的不居中，有点难理解

超链接和文本框的DOM元素层级是不一样的，这就是我上边描述的问题超链接

文本框

登录 · 13861900516

其实我的要求很简单，就是文本框的文字垂直居中显示，我觉得这是一个很合理的需求啊，自定义的文本框样式里既然可以对左右设置边距也起作用了，为什么对上下设置的就不起作用呢。

结果是这样的

所以看得出来，上边距此时变成10PX了，左右边距是没问题的。
另外padding的值都是5PX，总感觉系统强制上边距加了5PX

登录 · 13861900516

另外当鼠标焦点在文本框里的时候，又可以垂直居中的，焦点移除，又偏下了。
这是有焦点的效果，

		自动登录	找回密码
密码			立即注册

[已处理] 文本框内的文字没有垂直居中显示

最佳答案

10 个回复

本帖子中包含更多资源

本帖子中包含更多资源

本帖子中包含更多资源

本帖子中包含更多资源

本帖子中包含更多资源

微信认证勋章

讲师达人

悬赏达人

元老葡萄

活字格认证

活字格高级认证

圣诞拼拼乐