Html div周围的CSS边框包含span，同时与内容完美匹配

我试图让

div

以这种方式包装

span

元素：

----------
|判决|
----------
-----------------
|这是一辆出租车|
|判决|
-----------------

它适用于短句，但不适用于长句，因为最终结果如下：

----------------------
|这是一只龙|
|判决|
----------------------

代码如下：

带边框的

.div{
显示：内联块；
边框：1px纯红；
}
.带边框的分区{
显示：块；
}
桌子{
宽度：100px；
字体大小：16px；
}

判决
这是一个冗长的句子

请使

span

显示：块和
文本对齐：对齐
，这将有助于检查以下内容：


带边框的
.div{
显示：内联块；
边框：1px纯红；
最大宽度：100px；
}
.带边框的分区{
文本对齐：对齐；
显示：块；
}

这是一个很长的句子
这是文本换行时浏览器调整元素大小的结果。我不认为一个纯粹的CSS解决方案是可能的

可以实现这一点的一种方法是在Javascript中计算文本宽度，因为它不包含此换行边缘宽度。然后您可以强制容器的宽度为：

$(".div-with-border").each(function() {
  var textWidth = $(this).find("span").width();
  $(this).width(textWidth);
});

我使用jQuery来实现这一点，但您也可以使用vanilla JS。文本的宽度（特别是最长的文本行）是
.offsetWidth

这里有一个。
问题是什么？不确定我是否理解你的意思，你只需要div或span的最大宽度吗？我想我们需要更多地了解容器及其宽度的定义，以及你希望div的宽度如何定义。如果我理解得很好，在多行块中，您希望div正好是最长行的宽度吗？只需使用br标记并删除
max width
唯一的问题是它可能会导致一些非常糟糕的单词间距。例如，试试“这是一个句子”。如果你写“这是一个”，它取决于文本内容，它非常适合。@MarkLyons完全正确，对于这个例子，它看起来不错，但不是所有情况下都适用。因此，我仍然不能接受这个答案。我不喜欢这个答案，因为
文本对齐：justify属性给它一个不好的结果