今天群里一个朋友提出一个需求：
1、ul里的li左浮动，li的个数不定.
2、ul的宽度等于li的个数，不定宽.
3、ul的父级为定宽，但是ul需要根据li的数量的增多延x轴无限延伸.
4、能用css尽量用css解决
刚听到这个需求的时候觉得用css应该可以解决，但是怎么做都有问题，当我们都以为这只能用js解决的时候，一位细心的朋友巧妙的利用了white-space:nowrap解决了这个问题
下面是white-space在w3c中的描述

normal	默认。空白会被浏览器忽略。
pre	空白会被浏览器保留。其行为方式类似 HTML 中的
 标签。
nowrap	文本不会换行，文本会在在同一行上继续，直到遇到
 标签为止。
pre-wrap	保留空白符序列，但是正常地进行换行。
pre-line	合并空白符序列，但是保留换行符。
inherit	规定应该从父元素继承 white-space 属性的值。

查看DEMO
前端知识是学无止境的，没有什么是肯定的答案，只要努力、细心，很多问题都可以用更好的方法解决优化。