如何为具有固定高度的输入字段提供跨浏览器的文本垂直对齐?
到目前为止,line-height
似乎是我最好的选择。然而,在Chrome或Safari等webkit浏览器上,复制/粘贴时光标会跳到顶部对齐。
我注意到WordPress似乎有一个解决方案,他们的wp-login form。
有人知道WordPress是如何做到这一点的吗?
CSS
input {
width: 240px;
height: 32px;
line-height: 32px;
font-size: 18px;
}
1条答案
按热度按时间t0ybt7op1#
我对整个文档使用设置的行高,对标签和输入使用**
vertical-align: middle
,对padding
**。我还重新定义了
font
(系列和大小)的输入,与label
相同,因为浏览器已经有了它们的默认值,如13.3px...最后,
border: 1px solid someColor
将有助于浏览器与1多像素或一个插图。没有
height
。然后是Chrome和它的选择。哦,
@*$£#
... isellsoap forms.css搞定了它,通过删除和重新定义一切,除了它使用高度而不是填充(在我看来,它的通用性较差)