如何对齐 DIV 包含没有空格的字符串答案

【问题标题】：How to align DIV contains String with no Spaces如何对齐 DIV 包含没有空格的字符串
【发布时间】：2013-09-16 22:15:23
【问题描述】：

我有一个没有空格的动态字符串

i.e: 12345678912345678912345634589 // This is a dynamic content from php.

我有一个 DIV，宽度为 200px 因此，如果字符串中没有 没有空格，则该字符串将超出 DIV。我该如何解决？我希望这个字符串在达到 200px 的宽度限制时从 New Line 开始。

我也做了一个JsFiddle DEMO：

http://jsfiddle.net/ACF7N/6/

【问题讨论】：

【解决方案1】：

div {
    word-break: break-all;
}

【讨论】：

如果您想知道哪些浏览器支持它：caniuse.com/word-break
如果您想知道word-break 和word-wrap 之间的区别是什么（两者都有效），答案就在这里：stackoverflow.com/questions/1795109/…
@technophobia 我不知道浏览器支持正在被删除。请改用 nnnnnn 给出的答案。
你误会了，我只是分享一个资源来帮助他确定哪个浏览器支持该功能-仅此而已！ :)
绝对 - 但随着越来越少的浏览器支持分词（随着时间的推移，情况会变得更糟），使用自动换行会更好。我认为两者都在全球范围内实施，但显然情况并非如此。血腥歌剧 =]

【解决方案2】：

添加这个 CSS：

word-wrap : break-word;

【讨论】：

【解决方案3】：

如果您正在寻找仍然在一行中的内容，您可以使用类似的方法来获得：

#description
{
    border:1px solid #BBBBBB;
    width:200px;
    overflow:hidden; //add this
    text-overflow:ellipsis;  //and this
}

如果您不担心它会换行，其他答案之一将对您有所帮助:)

【讨论】：

【解决方案4】：

#description
{
    border:1px solid #BBBBBB;
    width:200px; 
    word-wrap: break-word; //Add this
}

或者，你也可以使用

overflow-wrap:break-word;

从规范，http://www.w3.org/TR/css3-text/#overflow-wrap， “word-wrap”作为“overflow-wrap”的替代名称

【讨论】：