绝对位置的文本换行遵循父级的边缘

Question

我似乎无法在规格中找到它。

当我使用absolute定位元素时，元素内的文本会使元素展开，直到文本然后换行的定位父级的边缘（在Firefox 5中）。

这意味着如果我将任何东西放在其父级的右边缘之外，我的文本将在每个单词后面换行。

有人能指出我的描述吗？

Answer 1

    <style type="text/css">
    #relative 
        {
        margin: 0 auto;
        background: #ccc;
        width: 100px;
        height: 100px;
        position: relative
        }

    #relative > div 
        {
        background: #f0f;
        position: absolute;
        top: 0;
        left: 150px;
        }
    </style>
    <!--...-->
    <div id="relative">
        <div>text text text</div>
    </div>

将绝对定位的div设置为width: 100%;或固定值以解决问题。它在the spec的normal flow部分中进行了描述。

    <style type="text/css">
    #relative 
        {
        margin: 0 auto;
        background: #ccc;
        width: 100px;
        height: 100px;
        position: relative
        }

    #relative > div 
        {
        background: #f0f;
        position: absolute;
        top: 0;
        left: 150px;
        width: 100%;
        }
    </style>
    <!--...-->
    <div id="relative">
        <div>text text text</div>
    </div>