①首先你的<li>是浮动的，也就是说li脱离了文档流，故它的父级ul是无法包围li的，所以li的内容增大缩小跟ul关系是不大。
②如果是你想实现：让li水平排列。同时div的内容增加后，div向下延伸。
可以直接限制li的宽度：
li {
float:left
width:100px
}
效果如下：
<ul>
<li>
<div>测试信息a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a </div>
</li>
<li>
<div>测试信息</div>
</li>
<li>
<div>测试信息bb b b b b b b b b b b b b b b b b b b</div>
</li>
</ul>
可以试试给.nav li 加上样式overflow:hidden或者zoom:1触发haslayout不过既然指定了line-height:50px不如把height也设为50px
不用height属性稍稍计算一下，对于单行的li，文字高度假设是12px，那么上下的边距就是4px，所以
li { font-size:12pxpadding: 4px 10px 4px 10px}
这样，当文字多余一行的时候就会自动加高而且保持边距
如果觉得多行文字显得拥挤的话，使用line-height来控制：
li { font-size:12pxline-height:14pxpadding 3px 10px 3px 10px}
这样就好多了
