Begründen Sie Text in einem HTML / XHTML TextArea-

Question

Ich versuche derzeit Text in einem Textfeld zu rechtfertigen, leider die CSS:

text-align: justify;

Ist auf dem Text wie Mitte nicht funktionieren, links und rechts tun. Ich habe versucht, dies sowohl in Firefox 3 und Internet Explorer 7 ohne Glück.

Gibt es eine Möglichkeit, um dieses?

Answer 1

Ich glaube nicht, diese in dem HTML-Textarea-Elemente möglich ist. Sie könnten eine Art WYSIWYG-Editor (editierbare div) nutzen können. dh. fckeditor

Answer 2

mich mit dem gleichen Thema befassen und fand heraus, sehr dumme Lösung. Stellen Sie sicher, dass der Text angezeigt werden fällt innerhalb der Start- und End-Tag Elemente in der gleichen Zeile und nicht in die nächste Zeile

<textarea  name="description" readonly="readonly" rows="4" cols="66">Text aligned toward left</textarea>

und nicht wie

<textarea  name="description" readonly="readonly" rows="4" cols="66">
Text aligned toward left
</textarea>

Answer 3

Je nach Ziel-Browser ... diese Lösung funktioniert in Chrome. Es funktioniert nicht in Firefox funktioniert aber ... aber ich werde es trotzdem posten.

Neben der Einrichtung text-align: justify, müssen Sie auch white-space eingestellt. Normal

    textarea {
        text-align: justify;
        white-space: normal;
    }

JSFIDDLE: http://jsfiddle.net/cb5JN/

Answer 4

Ich glaube, dass gängige Praxis ist, die TEXTAREA für die Eingabe zu verwenden, ohne sich um Rechtfertigung zu worying; und dann, wenn der Eingang verarbeitet wird (dh der FORM abgegeben wird oder ein Ereignis der TEXTAREA wird erfaßt), wird der Inhalt angezeigt werden, in einem nicht-editierbare Textelement (wie P, SPAN, TD), wo das text-align: justify; style-Attribut wird geehrt werden.

Answer 5

Für mich (in Firefox), dieser Code funktioniert perfekt:

textarea{
    resize: none;
    text-align: justify;
    white-space: pre-line;
    -moz-text-align-last: left;
    text-align-last: left;
}

Answer 6

ein gemeinsames div Verwendung mit contenteditable = "true" in meinem Fall gearbeitet. Nicht jedoch für die meisten mobilen Browser.

<div contenteditable="true">Some content</div>

Answer 7

Es funktioniert gut auf Chrome, aber nicht auf IE.

text-align: justify; white-space: normal;