Как сбросить стиль кнопки по умолчанию в Firefox 4+ - PullRequest
21 голосов
/ 28 марта 2011

В Firefox 3.6 вы можете использовать ::-moz-focus-inner {border:0;padding:0;margin:0;} для удаления этих полей и отступов по умолчанию forms.css добавлено.

Как я могу сбросить это в Firefox 4? Я искал любые файлы .css в каталоге установки, которые могли бы добавить стили к моей кнопке, но не могу найти ни одного для ff4 - кнопка все еще получает тот раздражающий верхний отступ 1px, который не позволяет тексту выравниваться по вертикали средний.

http://easwee.net/other/FF_problem.gif

РЕДАКТИРОВАТЬ: я использую таблицу стилей сброса, поэтому нет необходимости сбрасывать стили. Это таблица стилей браузера, которая не работает здесь.

Ответы [ 4 ]

26 голосов
/ 28 марта 2011

Я сам нашел решение.

В вашем поле URL введите: resource://gre-resources/forms.css - откроется файл forms.css для FF4 - и будет выполнен поиск следующего селектора

button::-moz-focus-inner,
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

Теперь просто поместите это в вашу основную таблицу стилей, например:

button::-moz-focus-inner,
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 {border:0;padding:0;margin:0;}

Это больше не должно переопределять ваш CSS.Также обратите внимание, что если вы не определили стиль шрифта для своих входных данных, FF не будет наследовать стили основного шрифта.

1 голос
/ 11 апреля 2012

Twitter Bootstrap делает это следующим образом в reset.less (что более barebones версия normalize.css):

button::-moz-focus-inner,
input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
  padding: 0;
  border: 0;
}

Кроме того, Bootstrap reset.less, вероятно, является более надежным и постоянным решением для кросс-браузерности форм, чем поддержание ваших собственных правил. Это гораздо более полно, чем reset.css Мейера, но более минималистично, чем normalize.css.

1 голос
/ 28 марта 2011

попробуйте установить его значения неопределенными (border:undefined и т. Д.). не уверен, но у меня это сработало, когда у меня была похожая проблема.

0 голосов
/ 28 марта 2011

просто используйте таблицу стилей сброса CSS, которая сбросит все CSS по умолчанию для большинства браузеров

http://meyerweb.com/eric/tools/css/reset/

или прочитайте этот стек переполнения Q & A

https://stackoverflow.com/questions/116754/best-css-reset

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...