css - 如何使用位置 :absolute inside the parent div? 放置此子 div

Question

我有一个 div，我试图将 div 放置在一个盒子的形式中。问题是我需要使用 position:absolute 来保持灵 active 。但是当我应用 position: absolute 时，框会超出父 div。

图片与

    .new-div{
    background: rgb(255, 255, 255);
    background: rgba(255, 255, 255, 0.7);


    /*float: left;*/
    min-width: 3em;
    min-height: 2em;
    max-width: 48ex;
    margin: 2em;
    padding: 1em;
    margin-left: 70%;
    position: absolute;

    word-wrap:break-word;
    top: 52%;

    /*left: 50%;*/
    /*right: -2%;*/
    /*transform: translateX(-50%) translateY(-50%);*/
    border: 1px solid rgb(200, 200, 200);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 16px;
    box-shadow: 2px 5px 5px rgba(0,0,0,0.2);
}

当我删除 position: absolute 时，它工作正常。

但我需要使用position:absolute。有人可以建议解决方法。

Answer 1

父 div 位置应该是相对的。

<div style='position:relative'>
    <div class='new-div'>
    </div>
</div>