Где я должен сообщить об ошибке - Firefox или Internet Explorer? - PullRequest
0 голосов
/ 26 ноября 2010

Internet Explorer ведет себя не так, как Firefox, Chrome, Opera, Safari. Смотри мой вопрос: HTML-ссылка с активным отступом и стилем CSS не работает

Это неопределенное поведение? Или мне нужно сообщить об ошибке. Если позже, то какой из браузеров делает правильно?

Вот тестовый код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>css active padding href problem</title>
        <style type="text/css">
            a{
                background:#CCC;
                border:1px solid #666;
                padding:0 35px 0 0;
            }
            a:active{
                padding:0 0 0 35px;
            }
        </style>
    </head>
    <body>
        <div>
            <p>Click on <i>Stack</i> - href does not work.
               Click on <i>Overflow</i> - href works.
               All browsers are affected.
               Except IE.</p>
            <a href="https://stackoverflow.com/">StackOverflow</a>
        </div>
    </body>
</html>

Ответы [ 2 ]

3 голосов
/ 26 ноября 2010

Я думаю, что IE делает неправильно. a: active работает, когда кнопка мыши нажата, но href не отключается, пока кнопка мыши снова не нажата.

Псевдо-код:

onmousedown(e) {
  setCssAsActive();
}
onmouseup(e) {
  activateHref();
}

Если мышь выходит за пределы элемента, ничего не происходит. Попробуйте щелкнуть ссылку, затем перетащите мышку от ссылки и отпустите кнопку. Ничего не должно случиться.

Это то, что происходит в вашем коде. Когда вы нажимаете на текст в стеке, ссылка отходит от вашего указателя, а когда вы отпускаете кнопку, ссылка больше не находится под указателем. Он возвращается во время релиза, но потом уже слишком поздно.

Поэтому я думаю, что IE делает не так.

0 голосов
/ 26 ноября 2010

Основная проблема, я думаю, заключается в блочной модели IE, как указано здесь http://en.wikipedia.org/wiki/Internet_Explorer_box_model_bug

Поскольку ссылка говорит, что IE включает заполнение в блоке, именно поэтому ссылка работает на IEно не в любом другом браузере, это подтверждается изменением отступа на margin в приведенном выше примере или здесь http://jsfiddle.net/S5dGw/

Хотя большинство (включая меня) сказали бы, что это ошибка IE, некоторые скажут, что этоэто проблема W3C со спецификациямиhttp://www.crossbrowser.net/82/internet-explorer-box-model-is-not-a-bug/ scoff .

Не беспокойтесь, когда CSS3 полностью поддерживается (это отдаленное будущее :)), у него будет атрибут box-sizing, который исправит этопроблема, см. ниже:

http://www.w3.org/TR/css3-ui/#box-sizing

...