如何在password类型的输入元素中设置文本位置？

Question

我有一个input type="password"对象，我需要显示一个超大的密码字体。

我无法正确获取密码点到中心和空间。我在下面发布的jsfiddle中有一个简化版本。

padding-bottom不起作用，因为在我的情况下，它只会删除部分点并且不会将其向上移动。我也试过line-height无济于事。

我指的是当我将尺寸设置得更大时，输入元素中密码点的位置变低。如果我填充底部它会移除部分点，但我只需稍微向上移动它们。

另外，在回答其他答案时，将输入大小的高度设置为字体大小将不起作用，因为这会使输入太大。我需要使密码点大于它们的初始大小，但不要使输入更大。当我改变尺寸时，它会向下推动圆点，我需要将它们带回到较小的框中心，但不使用padding-bottom。

.myPasswordStyle
{
    height: 40px;
    font-size: 50px;
}
<input type="password" class="myPasswordStyle">

https://jsfiddle.net/nfcrbd7m/

Answer 1

您可以删除height属性，并让字体大小设置输入的高度：

.myPasswordStyle {
    font-size: 50px;
}

当它是密码字段时，添加一个小的底部填充将使它看起来更加垂直对齐，即

.myPasswordStyle {
    font-size: 50px;        
    padding-bottom:5px;
}