特殊情况下文本不会中断

Question

我有一个问题，文本不会在使用 Vue.js 制作的弹出窗口中中断，它包含在 header 中，如下所示：

如果我将弹出窗口包含在主屏幕中，文本会正常中断，但如果我将它包含在 header 中，则文本不会中断。我还在包含文本的

元素周围绘制了边框，并且边框绘制正确。

Answer 1

您可以添加以下样式规则：

white-space: pre-wrap;

在 :

<p slot="modal-paragraph" style="border-style: solid;whitespace:pre-wrap">

Answer 2

class .header-frame 正在添加 css:

.header-frame {
  white-space: nowrap;
}

这就是文本在 header 中不会中断的原因。

尝试添加

white-space: pre-wrap;

或

white-space: initial;

Answer 3

尝试删除：

white-space: nowrap;

来自 header-frame class

Text doesn't break in special case