Div在窗口大小调整时不会移动

我在另一个div的顶部有2个div，但是当我调整窗口大小时，它们保持放置，而不是移动它们后面的div。我认为如果这个位置是相对的，他们会与前一个div一起移动，但它似乎并不像这样工作。我错过了什么？Div在窗口大小调整时不会移动

下面的CSS和HTML简化了。

<div class="wrapper" style="margin: 0 auto; text-align: center;"> 
<div id="0"> 
      <img src="0.gif" width="960px" alt="" /> 
      <div class="top"> 
       <div id="tag" ><img src="tag.png" alt="" /></div> 
       <div id="tag2"><img src="5500.png" alt="" /></div> 
      </div> 
</div> 
</div>

和CSS这样的：

#0 { 
     clear:     right; 
     z-index:    0; 
}  
.top { 
     float:     left; 
     z-index:    1; 
     clear:     left; 
     position:    relative; 

} 

#tag { 
     margin-top:    -500px; 
     margin-left:   -600px; 


} 

#tag2{ 
     margin-left:   750px; 

}

来源

2011-10-07 HankSmackHood

position：static ...为什么？ – Jordy

@Jordy不完全确定，玩过很多东西，一定忘记把它取出来。现在去除。 – HankSmackHood

我的眼睛受伤了。注意，不建议让ID以数字开头。 –

好像你期待的top DIV，与其相关的tag div的，当你调整页面大小与0.gif图像移动。相反，它正在相对于wrapper div的左边缘移动，该边缘与屏幕的左侧固定在一起。您可能会通过将width: 960px添加到.wrapper div的样式中来获得所需的结果。

为了进一步的启发，请检查每个div的边界框。你可能会发现一个临时的border: 2px solid green风格有助于解决问题。

来源

2011-10-07 17:05:56 eswald

Div在窗口大小调整时不会移动

回答

相关问题