css - 如何使文本重叠

Question

我想让 2 DIV 水平重叠。我希望 DIV 内的内容也重叠。在下面的示例中，aaaaaaa 环绕块 A，预期的行为是让 aaaaaaa 从 div B 的左边框开始。我该如何实现呢？

<div id="A" style="float:left;position:relative; background: #987321; width: 100px; height: 300px; z-index:5; "></div>`
<div id="B" style=" background: #555; width: 400px; height: 400px; ">aaaaaaaaaa</div>

小提琴

Answer 1

尝试这个：

CSS

<style>
    div.a {
        width:      100px;
        height:     300px;
    }

    div.b {
        position:   relative;
        z-index:    0;
        width:      400px;
        height:     400px;
        margin-top: -300px;
        border:     1px solid red;
    }

    div.c {
        position:   relative;
        z-index:    1;
        height:     100%;
        border:     1px solid blue;
    }
</style>

HTML

<div class="a">
    <div class="c">div A's content</div>
    <div class="b">div B's content xxxxx</div>
</div>