Div, чтобы расти с контентом, используя JQuery

Question

У меня есть div с именем #devices, и я использую ajax для его заполнения, но у меня возникла небольшая проблема со стилем, я добавляю json к div устройств следующим образом:

$('#devices').html(json);   

Я установил ширину устройств в моем CSS следующим образом:

#devices
{
    border:thin solid #C7C7C7;
    padding:20px;
    width:600px;
}

Я не уверен, какой будет ширина контента, поскольку она может измениться, когда пользователь изменяет элемент в выделенном элементе.поле, как мне сделать так, чтобы текст обернулся внутри div шириной 600px?

Прямо сейчас контент печатается одной огромной линией, проходящей через всю страницу и вне div,

Спасибо!

Answer 1

Вы можете использовать whitespace: pre-wrap.

Альтернативно, вместо вставки строки JSON непосредственно в #devices div, почему бы не использовать jquery . tmpl или некоторые другие JavaScript шаблонизатор для генерации HTML для списка ваших устройств?

Answer 2

Текст будет автоматически переноситься внутри div с использованием стандартной настройки whitespace CSS (по умолчанию normal).Обратите внимание, что текст никогда не «переносится» в середине границ, не являющихся словами, таких как очень длинная строка символов, таких как xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -Если это так, установите overflow:auto (для полос прокрутки) или overflow:hidden (для отсечения), чтобы текст не выходил из контейнера.