显示相同长度的多个文本行

Question

我希望多行文本打破/自动换行，以便它出现在一个完美的框中。文本不是字符串，而是由连接在一起的各个字符组成，如下所示：<span>L</span>

我已经尝试过这个css，但是我得到了你在左边看到的结果......

        body { 
            font-family:monospace;
            width: 200px;
            word-wrap: break-word;
            display: inline-block;
        }

我也试过text-align: justify;但没有成功..

Answer 1

我想这就是你想要的：http://jsfiddle.net/bL50ow0b/1/？

text-align: justify就是您所需要的。

Answer 2

如果您发布的文字更容易，那么很难理解您对跨度与字符串的含义。

这两个版本在这个小提琴中适用于我：https://jsfiddle.net/eq994mpu/1/使用以下代码：

p {
    width:50px;
    word-wrap:break-word;
}

Answer 3

要实现此目的，您需要添加以下代码：

body {
    width:500px;
    text-align: justify;
}

Answer 4

CSS答案提供了一定的工作，但不保证每一行都是由n个字符组成，因此可以看到偶数行。我在每<br/>个字符后插入n。类似的东西：

for (;;) {
    if (counter >= n) {
            myDiv.appendChild(document.createElement("br"));
            counter = 0;
    }
    counter++;
    myDiv.appendChild(span);
 }