css – 单击子对象不会触发父进程：在IE中为活动状态

我在IE 8-10中发现了一个令人烦恼的错误,从而阻止了父进程的活动状态被触发.看来,如果父元素的子对象是单击事件的目标,则不会触发父元素上的活动状态.

Here is a working example.如果您单击< li>中的文本元素不会改变颜色.如果您点击< li>除< p>之外的任何地方孩子的元素会变蓝.

这是一个问题,因为它几乎渲染了css：活动伪状态在IE中无用,如果元素有任何孩子.

以前有没有人遇到这个问题,甚至更好地找到了一个方法？

解决方法

以下是一个简单的解决方法：在段落中添加一个CSS规则.

Working example

CSS

ul { list-style: none; }
li { height: 50px; margin-bottom: 4px; background: red; }
li:active { background: blue; }
p:active { background: blue; height: 100%;}