Firefox中的文本输入边距

Question

我在firefox中输入文本有问题，它有一些边距我可以;摆脱它们，也许这个空间不是边距？（它在输入的边界之外，所以它看起来像一个余量）。

在上图中输入的宽度设置为100％，边距和填充为0，我也尝试设置-moz-box-sizing：border-box;

我想要一些资源或解释让我明白那个空间是什么，我怎么能摆脱它？ 感谢。

EDIT1： 这是我目前的测试页面 https://www.designersbookshop.com/support/test.html 我也在... test_2.html中复制了一份（我将尝试关于test.html的建议）， 检查左侧的输入。

EDIT2： 我的Firefox版本是10.0.2 这里是一个输入元素在firebug中的样子，很明显在边界外面绘制了一个边缘或类似的东西（或者我很愚蠢，但我想学习） 在输入边框上方的图像中，输入的左侧和右侧可见小线（1px）。

Edit3我弄明白了，是边框，我在Ubuntu但我在Mac上有类似的东西，所以它是添加白色边框的主题引擎？

Answer 1

可能是outline或border

尝试

input {
   padding:0;
   margin: 0;
   border: none;
   outline: none;
}

更新：我无法在我的系统上复制您的问题。这就是我所看到的

Answer 2

你正在使用OSX吗？我认为你所指的是焦点突出。它只出现在活动元素上，对吧？

通常由

控制

input:focus {
  outline: none;
}

有些人也使用它去除链接周围的矩形。这是一种不好的做法，因为它降低了可用性，因为用户无法直观地看到什么是活动链接。 （想想键盘用户。）

仅供参考：以下是Windows 10下Firefox 10中测试页（来自Edit1）的屏幕截图：http://img210.imageshack.us/img210/1764/inputform.png

由于HTML中的输入字段一直存在 - 它们的外观通常由操作系统或浏览器决定。很难获得一致的外观。