Кнопки слишком высоки в Firefox

У меня проблема с Firefox. Я пытаюсь создать ссылки и кнопки, чтобы выглядеть точно так же. В каждом браузере, кроме Firefox, это работает по желанию. В Firefox высота содержимого кнопки составляет 18 пикселей, по сравнению с 15 пикселями для ссылки. В Chrome, Safari и Internet Explorer они равны 15-ти высоким. Почему это?

Вот демо на jsFiddle проблемы. Вот результат, который я получаю в Chrome:

и здесь результат Firefox:

Я попытался изменить высоту вручную в CSS, но это не совсем работает и разбивает макет на другие браузеры. Настройка -moz-appearance: none ничего не делает, но опять же, обычно это не так.

Здесь представлена полная деталь моей попытки и что она будет использоваться для.

Кто-нибудь сталкивался с этой проблемой раньше? Как можно выравнивать высоту во всех браузерах?

Ответ 1

Нашел другого пользователя, который использовал это:

input::-moz-focus-inner /*Remove button padding in FF*/
{ 
    border: 0;
    padding: 0;
}

http://jsfiddle.net/MCAllinder/dehda/2/

Ответ 2

Я нашел полное решение и написал об этом здесь:

http://davidwalsh.name/firefox-buttons

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

Вам нужно изменить верхнюю и нижнюю границы полей, чтобы они соответствовали вашим другим кнопкам.