IE7下父元素及子元素的隐藏顺序不当带来的display:none出现BUG

在IE7浏览器中，当父元素使用display:none属性隐藏，子元素也使用display:none属性隐藏且先于父元素隐藏，再显示的时候会出现BUG，即子元素无法显示。要解决这个问题，可以执行以下步骤：

1. 使用visibility:hidden代替display:none

在IE7浏览器下，使用visibility:hidden代替display:none能够避免父元素和子元素隐藏顺序不当造成的BUG。因为visibility属性的显示和隐藏不影响文档流，所以子元素能够正常显示。

.parent-element {
  visibility: hidden;
}

.child-element {
  visibility: hidden;
}

1. 将子元素放在父元素之后

如果使用display:none隐藏元素，则需要确保子元素放在父元素之后，然后再将其隐藏。这样可以避免子元素因为先于父元素隐藏而无法正常显示。

<div class="parent-element">
  父元素
  <div class="child-element">
    子元素
  </div>
</div>

.child-element {
  display: none;
}

.parent-element {
  display: none;
}

也可以使用z-index属性将子元素放在父元素之后，来保证子元素正常显示。但是如果多个嵌套层级的元素都需要使用z-index属性来控制显示顺序，就会变得比较麻烦。

总之，在IE7下，避免父元素和子元素隐藏顺序不当是非常重要的，否则会出现一些奇怪的BUG。对于以上两个方法，开发者可以根据实际情况选择合适的解决方案。