Видаліть зайвий інтервал / заповнення кнопок у Firefox

Дивіться цей приклад коду: http://jsfiddle.net/Z2BMK/

Chrome / IE8 виглядають так

Firefox виглядає так

Мій CSS є

button {
    padding:0;
    background:#080;
    color:white;
    border:solid 2px;
    border-color: #0c0 #030 #030 #0c0;
    margin:0;
}

Як я можу змінити зразок коду, щоб кнопка стала однаковою в обох браузерах? Я не хочу використовувати гіперпосилання на основі JavaScript, оскільки вони не працюють з пробілом на клавіатурі, і він повинен мати hrefURL-адресу, яка не є чистим способом обробки речей.

Моє рішення, починаючи з Firefox 13

button::-moz-focus-inner { margin: -1px; padding: 0; border-width: 1px; }

Додайте це:

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

http://jsfiddle.net/thirtydot/Z2BMK/1/

Включення borderнаведеного вище правила необхідно, щоб кнопки виглядали однаково в обох браузерах, але також видаляє пунктирний контур, коли кнопка знаходиться activeу Firefox. Багато розробників позбавляються цього пунктирного контуру, за бажанням замінюючи його чимось більш візуальним.

Щоб виправити це на елементах введення, також додайте

input[type="reset"]::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner, 
input[type="submit"]::-moz-focus-inner, 
input[type="file"] > input[type="button"]::-moz-focus-inner

просто ідеально!