我怎样才能围绕堆叠元素(即具有负边距的元素)换行?

我希望有人能帮助我。

我想围绕多个堆叠浮动元素进行文本打包,但是当我为第二个元素添加负边距时,文本不会弹出球体(请参阅下文)...

有没有人有解决方案,可以帮助我呢?

提前致谢!

到目前为止我所做的是:

<style>
.elements {
    float:left;
    padding:10px;
    width:50%;
    background:#039;
    color:#fff;
    font-family:Arial, Helvetica, sans-serif;
    color:#fff;
    padding:50px;
    box-sizing:border-box;
    margin-right: 20px;
    position: relative;
}

#element-two {
    margin-top:-50px;
    background:#900;
    margin-left:30px;
}
</style>


<div id="post">
<div id="element-one" class="elements">Element 1</div>
<div id="element-two" class="elements">Element 2</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam id dictum odio. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus vitae leo dictum, <br>
<br>
<br>
porttitor augue ut, accumsan nunc. Phasellus at malesuada orci, quis varius nulla. Nullam dui purus, elementum non fermentum eu, 
laoreet ac massa. Maecenas dictum elit sit amet mi pretium tincidunt. Maecenas interdum elementum lectus, eu aliquam nibh lacinia nec. 
<br><br><br>
Quisque facilisis accumsan blandit. Mauris eget pulvinar lacus. Donec pretium posuere mattis. Suspendisse et tempor orci, sit amet placerat neque. Etiam laoreet massa eu libero posuere, sit amet laoreet metus auctor.

</div>

我希望如何查看页面 我希望如何查看页面

页面的外观如何 页面的外观如何


希望这可以帮助。

 `https://jsfiddle.net/0zf7rxpn/1/`

总之,我把负边界底部放到蓝色元素上,所以红色元素上升了。 然后对红色的元素,我给了一些保证金,权利,位置:相对和负面的权利。

链接地址: http://www.djcxy.com/p/91581.html

上一篇: How can I wrap text around stacked elements (ie elements with negative margins)?

下一篇: Sorting and filtering on Date