使用JQuery与内容一起成长

Question

我有一个名为#devices的div，我使用ajax来填充它，但是我有一些样式问题，我将json附加到这样的设备div：

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

我在我的css中设置设备的宽度，如下所示：

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

我不确定内容的宽度是什么，因为当用户更改选择框中的元素时它可以更改，我该如何制作它以便文本将包装在600px宽的div中？

现在，内容被打印在一条巨大的线上，该线延伸到整个页面并从div开始，

谢谢！

Answer 1

您可以使用whitespace: pre-wrap。

或者，不要将JSON字符串直接插入#devices div，为什么不使用jquery。tmpl或some other {{3}模板引擎为您的设备列表生成HTML？

Answer 2

文本将使用标准whitespace CSS设置自动换行div（默认为normal）。请注意，文本永远不会在非字边界的中间“包裹”，例如非常长的字符串，如xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx。

这是您关注的退化用户输入案例吗？如果是这样，请设置overflow:auto（对于滚动条）或overflow:hidden（用于剪切）以防止文本转出容器。