问题：如下图
这个时候，右边有一撮的元素，自动排列，不知道宽度。
右边常见的写法有两种
1 div>a*n 这种情况下，a不需要浮动
这个时候，我试了，word-break和word-wrap.在各浏览器下表现不一致。
转而改成，a:{display:block;float:left;white-space:nowrap;}这样就OK了
2 ul>li*n>a 这种情况下，li左浮动
这时候同样按照上面的样式写就OK了。
关于word-break,word-wrap,white-space
1 white-space: 是否折行 。参考w3school的属性
可取的值：其中inherit属性，ie8以下不支持
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。
pre-wrap 保留空白符序列，但是正常地进行换行。
pre-line 合并空白符序列，但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。
上面一个是通用属性，下面两个是ie专有的
2 word-wrap
normal: 允许内容顶开指定的容器边界
break-word: 内容将在边界内换行。如果需要，词内换行word-break也将发生
3 word-break
normal : 允许在词间换行
break-all： 该行为与亚洲语言的 normal 相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all ：与所有非亚洲语言的 normal 相同。对于中文，韩文，日文，不允许字断开。适合包含少量亚洲文本的非亚洲文本
总结：
word-wrap: break-word; 和 word-break: break-all;，两者都将文本限定在了容器的范围内。
观察这里的显示。http://dancewithnet.com/lab/2008/word-break-all/
单词，纯字母加空格。
1，word-wrap.
ie和firefox大体一致。对单词换行，对符号的换行处理不一致。
2，word-break.
firefox下。一个单词结束才换行。
ie下。彻底的换行，不能超出边界，但是不能处理符号。
只是 break-all 将所有单词，不论长短地，通通截断，break-word 它尽量地遵从了排版规则。
总的来说，以上两属性在两浏览器中表现不一致。因为不是w3c的标准属性。而white-space这个属性是所有浏览器通用的标准属性。
这里是我总结的关于换行的规则 http://www.riyue.me/file/csstest/newline.html