父元素设pointer-events:none后，伪元素cursor:not-allowed无效问题

父元素设置pointer-events: none后，伪元素会继承这个属性，导致伪元素无法响应任何鼠标事件，所以你设置的cursor: not-allowed不会生效。

解决方法很简单，给伪元素单独加上pointer-events: auto，让它能独立响应鼠标事件：

修改后的CSS代码：

.pointer-events-none {
    position: relative;
    pointer-events: none;
}

.pointer-events-none:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    cursor: not-allowed;
    /* 添加这行让伪元素能响应鼠标事件 */
    pointer-events: auto;
}

这样伪元素就能覆盖在父元素上方，既保持父元素不响应鼠标事件，又能正常显示not-allowed光标。

内容的提问来源于stack exchange，提问作者Hau Chung