Question

我想定义以下子div位置。

|-------------------|
|  parent div       |
|                   |
|                   |
|                   |
|    |-------|      |
|    |  child|      |
|    |  div  |      |
-----|       |------|
     |-------|

我使用相对位置来定义子div的位置，但它扩展了

|-------------------| 
|  parent div       |
|                   |
|                   |
|                   |
|    |-------|      |
|    |  child|      |
|    |  div  |      |
|    |       |      |
|----|-------|------|

我想知道如何在不扩展父div的高度的情况下定位子div。

Answer 1

您可以使用子div的相对定位来完成它

HTML

<div class="parent">
<div class="child">
    </div>
</div>

css：

.parent
{
    background-color:green;
    height:500px;
    width:500px;
}
.child
{
    position:relative;
    top:350px;
    left:200px;
    height:200px;
    width:100px;
    background-color:red;
}

您可以根据要求设置颜色和宽度。看看JsFiddle

定位子div而不扩展父div

1 个答案: