css - 如何让文字重叠

Question

我想让2个DIV水平重叠。我希望 DIV 中的内容也重叠。在下面的示例中，aaaaaaa 环绕 block 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>

Fiddle

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>