pointer-events: li上没有不在边缘工作的事件吗？

Question

我正在IE Edge上测试。这是我的css代码：

li.inactive{
    pointer-events: none;
    background: #ccc;
    -webkit-filter: none;
    filter:none;
    opacity: 1;
    cursor: not-allowed;
    h1{
        background: #eee;
        color: #ccc;
        span{
            color: #ccc;
        }
        i{
            color: #ccc;
        }
    }
    h1:after{
        border-color: transparent transparent transparent #eee;

    }
}

在chrome上，它可以工作，但在上，我可以将鼠标悬停在h1上，然后单击li。有什么建议吗?我该怎么解决呢？

Answer 1

除非display设置为block或inline-block，否则pointer-event在IE11和边中的链接上不起作用。Source

除非指定了li-item，否则它既不是display:block;也不是display:inline-block;，因此要解决此问题，请尝试执行以下操作：

li.inactive{
    display:block;
    pointer-events: none;
    background: #ccc;
    -webkit-filter: none;
    filter:none;
    opacity: 1;
    cursor: not-allowed;
    h1{
        background: #eee;
        color: #ccc;
        span{
            color: #ccc;
        }
        i{
            color: #ccc;
        }
    }
    h1:after{
        border-color: transparent transparent transparent #eee;

    }
}

Answer 2

只需将diplay: inline-block;添加到您的CSS类中。

点击这里：https://codepen.io/ymana/pen/yGWPWw