CSS线路断开如果文本是一行，但如果超过1行，则不会断裂

Question

我正在尝试在方案1中产生CSS线路，而不是在方案2中。第一句话要多长。

方案1：

This is the first sentence of a block.
This is the second sentence of the block, which is wide.

方案2：

This is the first sentence of the next example that
breaks. This is the second sentence of the block, which
is wide.

仅使用CSS？我目前正在通过在窗口大小上运行的JS代码来解决此问题，但这很慢。

编辑：澄清这应该适用于动态文本长度。

Answer 1

简单地设置了在第一个方案中阻止的句子，并在第二种情况下为文本容器设置固定宽度，例如：

.scenario1 {
  width: 100%;
}
.scenario1 span {
  display: block;
}
.scenario2 {
  width: 400px;
}

<div class="scenario1"><span>This is the first sentence of a block.</span> 
<span>This is the second sentence of the block, which is wide.</span></div>
<br />
<div class="scenario2">This is the first sentence of the next example that breaks. This is the second sentence of the block, which is wide.</div>