Firefox在输入文本中添加2px额外填充并提交

Question

  

根据以下答案：这是最好的解决方案：   .text {line-height：15px; } input :: - moz-focus-inner {border：0;填充：0;边距：-1px; margin-bottom：-1px;}谢谢大家。

我知道Stackoverflow上有一些类似的问题。因为没有一个答案适合我，而且我已经研究了这个问题差不多一个星期但没有运气，我决定发布这个问题。请帮忙。

假设我有一个提交按钮和一个文本框，Firefox总是在元素中添加2px额外填充，我尝试了很多我在网上找到的解决方案，但没有一个能够工作。

在这里测试代码： https://jsfiddle.net/4f2duwud/7/

HTML：

<form action="http://google.com">
  <input type="submit" class="submit" value="Go to Google">
  <input type="text" class="text">
</form>

CSS：

a.button {
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  text-decoration: none;
  color: initial;
}
.text {
  padding:3px;
  border: 1px solid gray;
}
.submit {
  padding:3px;
  border:1px solid gray;
}
input[type="reset"]::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner, 
input[type="submit"]::-moz-focus-inner,
input[type="text"]::-moz-focus-inner, 
input[type="file"] > input[type="button"]::-moz-focus-inner { 
  border:0 !important; 
  padding:0 !important;
}

屏幕截图 - Firefox： 屏幕截图 - Chrome：

Answer 1

更新

https://jsfiddle.net/Lv1cb2xr/

input::-moz-focus-inner {
    border: 0;
    padding: 0;
    margin-top:-2px;
    line-height: 17px ;
}

Answer 2

尝试将line-height设置为15px至17px或@Override public void onCreate(SQLiteDatabase db) { db.execSQL(SQL_CREATE_TABLE); //sql string to create the table dbContents.baseContents(sqcontext); } ，或以适合您的方式设置

Answer 3

文本输入（Firefox 86 版）对我有用的是设置背景颜色：

"text of watermark"

一旦到位，您就可以设置填充，Firefox 会尊重它。

我不知道为什么 .text { padding: 0px; background-color: White } 有效而 background-color: White（如您在帖子中所述）无效。

我可以在链接的 jsfiddle (https://jsfiddle.net/Lv1cb2xr/) 中重现我的结果。在小提琴中设置 border: 1px solid gray 确实说服 Firefox 尊重填充 - 显然与 OP 的体验不同。

对我来说这似乎是一个 Firefox 错误，尽管毫无疑问，如果我要报告它，那么 mozilla 会告诉我它在原始 css 规范中，因此他们对此无能为力，但是嘿，我为什么不考虑为下一轮规范做出贡献？这就是我上次报告错误时发生的情况。但我并不苦涩——毕竟说了又做了，结果证明他们是完全正确的。等等，不，其实我还是很苦的。为什么我还是很苦？我不知道，我只是。

默认样式似乎是从 Firefox chrome 位置栏复制而来的，因此可能存在代码共享不当的问题。