Question

我有两个堆叠的div包含子元素，我想要的是如果我将隐藏的可见性设置为第一个div应该消失，第一个div下的第二个div应该取代第一个div，保持子元素的位置在第二个div内。

这是代码。

<div id="wrapper">  
     <div id="first" style="top:10px; width:400px; border-style:solid;border-width:1px;">   
        A quick brown fox jumps over the lazy dog..................
</div>

<div id="second" style="top:100px;width:400px; border-style:solid; border-width:1px;">
     <div id="child1" style="margin-left:250px">
            21st, October 2011
     </div>
  </div>
<div>

Answer 1

使用display:none代替visibility:hidden

Answer 2

CSS visibility: hidden;只会隐藏元素，它仍然会在文档流中为它保留空间。

你想要的是display: none;，它将完全删除元素。

Example coded here。（单击#second div激活。

Answer 3

如果您这样做：

<div id="wrapper" style="width:400px;">  
     <div id="first" style="display:none;top:10px; border-style:solid;border-width:1px;">   
        A quick brown fox jumps over the lazy dog..................
    </div>
     <div id="second" style="border-style:solid; border-width:1px;">
         <div id="child1" style="margin-left:250px">
                    21st, October 2011
         </div>
     </div>
</div>

将wrapper放在两个对象周围，如果隐藏第一个div，则第二个div会跳到第一个div的位置。

Div定位与子元素

3 个答案: