＆＃34; white-space：pre-line＆＃34;导致非块元素奇怪的拉伸

Question

在非white-space: pre-line元素上使用block时，Chrome，Opera和Safari（我怀疑基于WebKit和WebKit衍生的浏览器）似乎将元素拉伸到看似符合空白的区域，我相信他们应该崩溃。

＆＃13;

＆＃13;

div
{
    white-space: pre-line;
    display: inline-block;
    border: solid 1px #333;
}

＆＃13;

<!-- deep inside the document, on the 20th indentation level -->
                                        <div>single line</div>
                                        <div>multi
                                             line</div>
                                        <div>multi
                                             line
                                        </div>
                                                                                                                                <div>crazy
                                                                                                                                     indentation
                                                                                                                                </div>

＆＃13;

＆＃13;

＆＃13;

在Chrome，Opera和Safari中，上述代码生成：

虽然在Firefox中，它出现了（有点），正如我所期望的那样：

有趣的是，这似乎只取决于元素最后一行的长度：

＆＃13;

＆＃13;

div
{
    white-space: pre-line;
    display: inline-block;
    border: solid 1px #333;
}

＆＃13;

<!-- deep inside the document, on the 20th indentation level -->
                                        <div>multi
                                             line
</div> <!-- last line has 0 characters -->

＆＃13;

＆＃13;

＆＃13;

根据我对the specification的理解，white-space: pre-line应该将多个连续的空格（和制表符）折叠成最多一个字符。
这似乎在某种程度上发生，因为在第一个示例的框中没有用鼠标选择空格。
但是，框模型似乎将其内容的最后一行视为已应用white-space: pre。

• 这是WebKit引擎中的一个错误，还是有一些不明确的原因可以允许，甚至应该发生？
• 至少有两个HTML解决方法（使用<br>或删除缩进），但我宁愿让我的标记可读。那么是否有一种只有CSS的方式来修复＆＃34;盒宽？