Как я могу сделать текст на следующей строке вместо переполнения?

У меня есть фиксированная ширина div на моей странице, которая содержит текст. Когда я ввожу длинную строку букв, она переполняется. Я не хочу скрывать переполнение. Я хочу отобразить переполнение на новой строке, см. Ниже:

<div id="textbox" style="width:400px; height:200px;">
dfssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssfddddddddddddddddddddddsdffffffffffffffffsdffffffffffffffffdfssssssssssssdf
</div>

В любом случае отключить переполнение и поместить переполняющий текст на новую строку??? Twitter делает что-то вроде этого, но я не могу понять это с помощью CSS, возможно, они используют Javascript.

Может ли кто-нибудь помочь с этим?

Ответ 1

word-wrap: break-word

Но это CSS3 - http://www.css3.com/css-word-wrap/.

Ответ 2

Просто добавьте

white-space: initial;

текст строки автоматически появится в следующей строке.

Ответ 3

Попробуйте тег <wbr> - не такой элегантный, как свойство word-wrap, которое другие предложили, но это рабочее решение до тех пор, пока все основные браузеры (читают IE) реализуют CSS3.

Ответ 4

Хорошо, вы можете вставлять один или несколько "мягких дефис" () в свои длинные непрерывные строки. Я сомневаюсь, что старые версии IE справляются с этим правильно, но то, что он должен делать, это сообщить браузеру о допустимых разрывах слов, которые он может использовать, если это необходимо.

Теперь, как именно вы выбираете, где набить эти персонажи? Это зависит от фактической строки и того, что она означает, я думаю.