Question

我不知道为什么#mainControldiv div没有被它的包装div包围。这是跟随它的html和css：

的CSS：

*
{
 padding:   0px;
 margin:   0px;
}

div
{
 border:   1px solid;
} 

#mainWrapperdiv
{
 width:   1000px;
 margin:   0px auto 0px auto;
} 

#maindiv
{ 
 width:   850px; 
 height:   500px;  
 margin:   50px auto 0px auto;  
 border:   5px solid;
}

#mainControldiv
{
 width:   850px;
 height:   150px; 
 margin:   470px auto 0px auto;
 border:   5px solid;
 float:   right;
}

#moveablediv
 { 
  width:   50px;
  height:   50px;
  background:  lightgreen;   
  position:  relative;
  left:   400px;
  top:   200px; 
 }  

#centerPointdiv
 {
  width:   5px;
  height:   5px;
  background:  black;
  position:  relative;
  left:   22px;
  top:   22px;
 }

它应该是非常直接的，但我无法弄清楚为什么mainControldiv不会出现在mainWrapperdiv的边界内，它是直接的父级。而且，您是否也可以提前告知逻辑，或者说它为什么不能按照我的预期运作的内在原因。

Answer 1

你不能像这样结束div，即使div没有内容，它也必须有一个结束标记：

<div></div>

所以改变你的结构如下：

<body>
 <div id = "mainWrapperdiv"> 
  <div id = "maindiv">  
   <div id = "moveablediv" >
    <div id = "centerPointdiv"></div>
   </div> 
  </div> 
  <div id = "mainControldiv"></div>
 </div> 
</body>

主包装div的CSS问题

1 个答案: