对齐 HTML/XHTML 文本区域中的文本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/427039/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Justify Text in a HTML/XHTML TextArea
提问by Matt
I am currently trying to justify text in a textarea, unfortunately the CSS:
我目前正在尝试证明 textarea 中的文本，不幸的是 CSS：
text-align: justify;
Doesn't work on the text like center, left and right do. I've tried this in both Firefox 3 and IE 7 with no luck.
不适用于中心、左侧和右侧等文本。我在 Firefox 3 和 IE 7 中都试过这个，但没有成功。
Is there any way around this?
有没有办法解决？
采纳答案by John Boker
i dont think this is possible in the html textarea element. you might be able to use some sort of wysiwyg editor (editable div). ie. fckeditor
我认为这在 html textarea 元素中是不可能的。您也许可以使用某种所见即所得的编辑器（可编辑的 div）。IE。fckeditor
回答by shweta
I dealt with same issue and found out very stupid solution. Make sure that the text to be displayed falls within the start and end tag elements in the same line and not in the next line
我处理了同样的问题，发现了非常愚蠢的解决方案。确保要显示的文本位于同一行的开始和结束标记元素内，而不是在下一行
<textarea name="description" readonly="readonly" rows="4" cols="66">Text aligned toward left</textarea>
and not like
并且不喜欢
<textarea name="description" readonly="readonly" rows="4" cols="66">
Text aligned toward left
</textarea>
回答by Norman Breau
Depending on your target browser... this solution works in Chrome. It does not work work in Firefox however... but I'll post it anyway.
根据您的目标浏览器...此解决方案适用于 Chrome。然而，它在 Firefox 中不起作用......但无论如何我都会发布它。
In addition to setting text-align: justify, you must also set white-space: normal.
除了设置 text-align: justify 之外，还必须设置 white-space: normal。
textarea {
text-align: justify;
white-space: normal;
}
JSFIDDLE: http://jsfiddle.net/cb5JN/
JSFIDDLE：http: //jsfiddle.net/cb5JN/
回答by Olivier
For me (in Firefox), this code works perfectly:
对我来说（在 Firefox 中），这段代码很完美：
textarea{
resize: none;
text-align: justify;
white-space: pre-line;
-moz-text-align-last: left;
text-align-last: left;
}
回答by Ken Paul
I believe that common practice is to use the TEXTAREAfor input without worying about justification; and then, once the input is processed (i.e. the FORMis submitted, or an event of the TEXTAREAis captured), the contents are displayed in a non-editable text element (such as P, SPAN, TD) where the text-align: justify;style attribute will be honored.
我相信通常的做法是使用TEXTAREAfor 输入而不用担心理由；然后，一旦输入被处理（即，FORM被提交时，或的事件TEXTAREA被捕获），其内容被显示在不可编辑的文本元素（如P，SPAN，TD），其中text-align: justify;样式属性将被兑现。
回答by Edo
Using a common div with contenteditable="true"worked in my case. Doesn't work for most mobile browsers though.
在我的情况下，使用带有 contenteditable="true"的通用div有效。但不适用于大多数移动浏览器。
<div contenteditable="true">Some content</div>
回答by brunoguarato
It works fine on Chrome, but not on IE.
它适用于 Chrome，但不适用于 IE。
text-align: justify; white-space: normal;
文本对齐：对齐；空白：正常；
