Question

我有2个div。这是div1和div2。

我的div1具有以下样式属性：

.div1{
position:absolute;
left:0%;
top:0%;
width:auto;
height:auto;
}

和我的div2：

.div1{
position:absolute;
left:0%;
top:0%;
width:auto;
height:auto;
}

我想将我的第二个div设置在我的div1之下，每当我的div1的高度或宽度发生变化时，我的div2也会发生变化，仍然正好在div1之下。

请帮忙。

Answer 1

将div2位置设为相对位置。

HTML：

<div class="div1">adsf</div>
<div class="div2">adfad</div>

CSS：

div1{
position:absolute;
left:0%;
top:0%;
width:auto;
height:auto;

}
.div2{
position:relative;
left:0%;
top:0%;
width:auto;
height:auto;
background-color:#AAA;
}

Answer 2

如果你真的需要绝对位置，将div'包装到一个绝对位置的容器div中，然后将div1和div2都改为position relative。应该工作

Answer 3

如果您希望div2位于div1之下，那么position: relative应该这样做。如果您希望div2模仿div1的元素，在这种情况下，如果div1的宽度增加，并且您希望div2的宽度增加，我会制作一个父div（在本例中为mainDiv）包含div1和div2。以@Siyam Kumar为例。以下是我提出的建议：

HTML：

       <div class="mainDiv">
            <div class=div1>
                <p>this is Div 1 content</p>
            </div>
            <div class=div2>
                <p>this is Div 2 content</p>
            </div>
        </div>

CSS：

.mainDiv{
        padding:50px;
        width: 30px; <!-- you control both div1 and div2 here -->
    }

    .div1{
        position:absolute;
        left:0%;
        top:0%;
        width:auto;
        height:auto;
    }

    .div1{
        position:relative;
        left:0%;
        top:0%;
        width:auto;
        height:auto;
        background-color:#AAA;
    }

因此，使用mainDiv控制div。因此，如果您更改高度，则所有div将调整为mainDiv中指定的高度。

用css设置div元素位置

3 个答案: