Слишком высокие кнопки на Firefox - PullRequest
Новая
       10

Слишком высокие кнопки на Firefox

12 голосов
/ 14 января 2012

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

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

Result on Chrome

, а вот результат Firefox:

Result on Firefox

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

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

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

Ответы [ 2 ]

13 голосов
/ 14 января 2012

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

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

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

3 голосов
/ 16 мая 2013

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

http://davidwalsh.name/firefox-buttons

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

Вам нужно изменить поля наверху и на полях для соответствия другим кнопкам

...