css – 为什么大的负边际权利使绝对元素不包裹？

更新：

位置值会改变宽度.

JSfiddle：http://jsfiddle.net/caicai/mbtb5m7p/2/

为什么div .a2的宽度等于其父的宽度,而div .a1中的文本不会包装？

JSfiddle：http://jsfiddle.net/caicai/mbtb5m7p/

.r {
    position: relative;
    width: 100px;
    height: 22px;
    background: blue;
}
.a1 {
    position: absolute;
    top: 30px;
    margin-right: -9999px;
    background: green;
}
.a2 {
    position: absolute;
    top: 60px;
    background: orange;
}

<div class="r">
    <div class="a1"> 
        Why does this line no wrap. 
    </div>
    <div class="a2"> 
        Why does this line wrap. 
    </div>
</div>

解决方法

div.r的宽度为100px,相对放置.

孩子们.a1和.a2是绝对的.与他们(相对放置)的父母有关.

没有负边际,孩子的最大宽度等于其父母的大小.

但是,通过增加负边距,您可以让孩子们“浮动”其父母边界.

原文地址：https://www.jb51.cc/css/214265.html