Выравнивание текста в текстовой области HTML/XHTML

Question

В настоящее время я пытаюсь выровнять текст в текстовой области, к сожалению, CSS:

text-align: justify;

Не работает с текстом, как центр, лево и право.Я пробовал это как в Firefox 3, так и в IE 7, но безуспешно.

Есть ли способ обойти это?

Answer 1

Я не думаю, что это возможно в элементе html textarea. Вы можете использовать какой-нибудь редактор wysiwyg (редактируемый div). то есть. FCKeditor

Answer 2

Я имел дело с той же проблемой и нашел очень глупое решение. Убедитесь, что отображаемый текст находится внутри элементов начального и конечного тега в одной строке, а не в следующей строке

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

а не как

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

Answer 3

В зависимости от вашего целевого браузера ... это решение работает в Chrome. Однако это не работает, работает в Firefox ... но я все равно выложу.

Помимо настройки text-align: justify, вы также должны установить пробел: normal.

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

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

Answer 4

Я считаю, что общепринятой практикой является использование TEXTAREA для ввода, не беспокоясь об обосновании;а затем, как только ввод будет обработан (т.тот FORM представлено, или событие TEXTAREA захвачен), содержимое отображается в виде нередактируемого текстового элемента (например, P, SPAN, TD) где text-align: justify; Атрибут стиля будет учитываться.

Answer 5

Для меня (в Firefox) этот код работает отлично:

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

Answer 6

Использование общего div с contenteditable = " true " работало в моем случае. Не работает для большинства мобильных браузеров.

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

Answer 7

Он отлично работает в Chrome, но не в IE.

text-align: justify; пробел: нормальный;