CSS / JS在（自动）换行/文本换行之前删除空格

Question

我在一行中有3个元素：2个文本由分隔符分割。

<div class="wrapper">
    <div>this is my extra long text</div>
    <div class="divider">|</div>
    <div>text2</div>
</div>

这些元素位于容器内部，最大宽度会导致文本在太长时间内断开/换行。

我的问题： 一旦左侧文本中断，从左侧文本到分隔符的间距就会增加。我认为这是因为文本在白色空格之后被掠过但保留了该行中的空间。

我做了一个小提示来表明我的问题：https://jsfiddle.net/4857bb0s/15/

我该如何解决这个问题？

修改

看起来像（注意左侧文本和分隔符之间不需要的空格）：

应该看起来像：

Answer 1

你可以试试    {div> style = "text-align: justify"在您的div上留下长文字。