行高和卷轴的滚动问题Titillum Web字体系列

Question

如果我使用 Titillium web 字体系列，我可以滚动<span>和<input>，line-height值不是normal和{{1} }。但不是在我使用 San-serif 时。我希望当我使用<1.6时没有滚动。

我不知道，是因为line-height:1.4行为？

inline-block

.box {
    padding: 0;
    margin: 0;
    background-color: white;
}
input {
    display: inline-block;
    line-height: 1.4;
    font-size: 16px;
    font-family: Titillium web;
    padding: 0;
}
input.test {
    line-height: 1.2;
}
input.test-2 {
    line-height: normal;
}
span {
    display: inline-block;
    line-height: 1.4;
    font-size: 16px;
    font-family: Titillium web;
    overflow: auto;
    padding: 0;
      
    background-color: aqua;
}
    
p {
    font-size: 16px;
    font-family: Titillium web;
    line-height: 1;
    padding: 0;
    margin: 0;
}

以下是我的问题：

1. 每个字体系列都有不同的最佳<div class="box"> <span>@@@@</span><input type="text" value='@@@@' /><input class="test" type="text" value='@@@@' /><input class="test-2" type="text" value='@@@@' /> </div> <p>@@@@@@@@@@@@@</p>？
2. 如果是这样，我何时应该使用line-height？因为许多文章建议使用特定的line-height: normal

Answer 1

尝试在line-height和font-size中使用相同的值。 <{1}}也将1.4放入行高。