对齐和居中< textarea>文本HTML / CSS?

对齐和居中< textarea>文本HTML / CSS?

问题描述:

我有一个textarea,我希望它是对齐的,所以所有的线宽度相等,并且居中的文本保持在textarea的中间,当它不是最大行长。

I have a textarea and I want it to be justified so all the lines are equal in width and to be centered to the text stays in the middle of the textarea when it's not at maximum line length.

这是我的textarea:

This is my textarea:

<textarea class="Whiteboard" type="text" placeholder="Type something..."></textarea>

...和CSS:

textarea.Whiteboard{
    resize: none;
    background-color: #F1F1F1;
    border: none;
    height: 500px;
    width: 800px;
    text-align: center;
    font-size: 50px;
}

谢谢大家!

不幸的是,在编写期间没有具体的CSS解决方案来实现所需的结果。

Unfortunately there is no concrete CSS solution at the time of writing to achieve the desired result.

已经以名称 text-align-last 引入了一个功能来处理块的最后一行的对齐:

However CSS level 3 has introduced a feature under the name text-align-last to handle the alignment of the last line of a block:

7.3 Last行对齐:text-align-last属性

7.3 Last Line Alignment: the text-align-last property

此属性描述块或行右端的最后一行$ b $

This property describes how the last line of a block or a line right before a forced line break is aligned.

但仍处于工作草案状态。因此,浏览器支持不足以依赖此技术(它仍然是在Chrome 35上的错误,仅适用于Firefox 12 +)。

But it is still in Working Draft state. Hence the browser support is not good enough to rely on this technology (It's still buggy on Chrome 35 and only works on Firefox 12+).

这里是 示例 ,我无法验证(因为我的FF4。是!耻辱我)

textarea {
    white-space: normal;
    text-align: justify;
    -moz-text-align-last: center; /* Firefox 12+ */
    text-align-last: center;
}