在7+和Opera中出现z-index问题

问题描述

| 这是html：

<div id = \"parent\">
   <div id = \"one\" ></div>
   <div id = \"two\" ></div>
</div>

CSS：

#parent
{
  position:    relative;
}
   #parent > #one
   {
     position:  absolute;
     z-index:   10;
     top:       50px;
     left:      50px;  
     width:     100px;
     height:    100px;
     background:  white;        
   }
   #parent > #two
   {
     position:  absolute;
     z-index:   5;
     top:       50px;
     left:      50px;
     height:    50px;
     width:     50px;
     background: black;
   }

ie7 +和Opera中的问题是div \“ one \”与div \“ two \”没有重叠，这是为什么？     

解决方法

尝试在下面使用：

<div id = \"parent\">
   <div class= \"one\" ></div>
   <div class= \"two\" ></div>
</div>
css:

#parent
{
  position:    relative;
width: 150px;
height: 150px;
background: yellow;
}
   #parent  .one
   {
     position:  absolute;
     z-index:   10;
     top:       50px;
     left:      50px;  
     width:     100px;
     height:    100px;
     background:  white;        
   }
   #parent .two
   {
     position:  absolute;
     z-index:   5;
     top:       50px;
     left:      50px;
     height:    50px;
     width:     50px;
     background: black;
   }

希望你能找到线索