Css IE8错误？父节点显示设置为无，子节点仍然可见

在chrome和firefox中一切正常。 在IE8中，复选框和数字消失了，但图标仍然存在。

---

这是IE8的一个缺陷吗？如何修复它？

李需要进入

或
。否则会出现意外情况。
我找到了解决方案：
<div id="menu">
  <li id="light">
    <input type="checkbox" /><span class="icon"></span>Light
    <span class="number">12</span>
  </li>
</div>

#menu {padding-left:5px;margin:5px 0 5px 0;color:#666;}
#menu li{margin:2px 0;line-height:19px;}
#menu input{float:left;}
#menu .icon{margin:0 14px;float:left;height:14px;width:14px;position:relative;top:3px;background:url(img/bgs.gif);background-repeat:no-repeat;}
#menu .number{float:right;margin-right:9px;}
#menu #light .icon{background-position:-266px -484px;}

var li = document.getElementById("light");
li.style.display = "none";