Запретить перемещение <button> во время клика в IE

Когда у вас есть простой элемент на странице и нажмите его (удерживайте нажатой кнопку мыши во время щелчка, чтобы увидеть эффект) в IE8/9, кнопка немного сдвинется вниз и вправо.

Я предполагаю, что это часть стиля IE по умолчанию. Есть ли способ предотвратить это поведение?

http://jsfiddle.net/tmcconechy/hqm59/

Ответ 1

Вы можете остановить перемещение текста в IE-кнопке:

button:active span, button:focus span {
    position:relative;
    top: 0;
    left: 0;
}

<button><span>no move</span></button>

http://jsfiddle.net/dQVA7/

Ответ 2

Поместите текст в <span> и position:relative в него, это исправит.

button span{
    position: relative;
}

Нет необходимости в определении сверху и слева.

Ответ 3

Вы можете применить некоторые стили к кнопке. кнопка {margin: 0px; padding: 0px;}

Ответ 4

Если вы не против использования JavaScript, очевидно, что это делает трюк:

$(document).on('mousedown', 'button, input[type="button"], input[type="submit"]', function(e) {
  e.preventDefault();
});