我应该在哪里报告错误 - Firefox 还是 Internet Explorer？

发布于 2024-10-04 03:37:12 字数 1177 浏览 5 评论 0原文

Internet Explorer 的行为与 Firefox、Chrome、Opera、Safari 不同。看我的问题：具有填充和 CSS 样式活动的 HTML 链接不会work

这是未定义的行为吗？或者我需要报告错误。如果稍后，那么哪些浏览器做得正确？

这是一个测试代码：

<!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>

原文

Internet Explorer behaves differently from Firefox, Chrome, Opera, Safari. See my question:
HTML link with padding and CSS style active does not work

Is this undefined behavior? Or I need to report a bug. If later, then which of browsers are doing right?

Here is a test code:

<!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>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

伪心 2024-10-11 03:37:12

我认为IE做错了。 a:active 在鼠标按钮按下时起作用，但在鼠标按钮再次弹起之前 href 不会消失。

伪代码：

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

如果鼠标移到元素之外，则不会发生任何事情。尝试单击链接，然后将鼠标拖离链接，然后释放按钮。什么都不应该发生。

这就是您的代码中发生的情况。当您单击堆栈文本时，链接会从指针移开，而当您释放按钮时，链接将不再位于指针下方。它在发布时向后移动，但为时已晚。

因此，我认为IE做错了。

I think IE is doing wrong. a:active is working when the mousebutton is down, but the href doesn't go off before the mousebutton is up again.

Pseudo-code:

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

If the mouse goes up outside of the element, nothing happends. Try to click on a link, then drag your mouse away from the link and then release the button. Nothing should happend.

That is what happening in your code. When you are clicking at the Stack-text, the link moves away fron your pointer, and when you release the button, the link is no longer under the pointer. It moves back at the release-time, but then it is too late.

Therefore, I think IE is doing wrong.

回复收藏 0 原文

梦境 2024-10-11 03:37:12

我认为主要问题在于 IE 框模型，如此处所述 http://en.wikipedia.org/ wiki/Internet_Explorer_box_model_bug

由于链接说 IE 在框中包含填充，这就是该链接在 IE 上工作但在任何其他浏览器上不起作用的原因，通过在上面的示例中将填充更改为边距来证明这一点，或者在这里< a href="http://jsfiddle.net/S5dGw/" rel="nofollow">http://jsfiddle.net/S5dGw/

虽然大多数人（包括我自己）会说这是一个 IE 错误，但有些人会说这是 W3C 规范问题。 http://www.crossbrowser.net/ 82/internet-explorer-box-model-is-not-a-bug/嗤之以鼻。

不用担心，当 CSS3 得到完全支持时（这是遥远的未来:)），它将具有 box-sizing 属性，这将解决这个问题，见下文：

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