overflow：hidden不起作用的一种情况

不精确样式：
ul{ margin :0 ; padding :0; float :left ; list-style :none; width :100%;}
li{ float :left ; overflow :hidden ;}
当使用以上样式时，可以看到当li中的内容超过了li的宽度时，overflow属性没起作用。
正确的样式：
ul{ margin :0 ; padding :0; float :left ; list-style :none; width :100%;}
li{ float :left ; overflow :hidden ;text-overflow:ellipsis; white-space:nowrap; }
需要三者配合使用！

来源：http://blog.sina.com.cn/s/blog_67c4e72501010m6l.html

我在测试的时候加上宽度，或者高度才出效果。

 

经验记录：

.global { width:100%; height:auto; position:absolute; bottom:0px; }
.global ul { width:100%; height:auto; padding:0px; margin:0px; }
.global li { list-style:none; text-align:center; float:left; border:1px solid #CCCCCC; margin:2px; }

li个数太多的时候会自动换行，如果将.global的高度设置为height:200px;是没有效果的，要将.global ul的高度设置为height:200px;并且添加元素浮动溢出 overflow:hidden 才可以隐藏。

 

其实我想表达是的，1.有些css属性要配合使用，2.要最近的元素例如：父元素，甚至是元素本身。才有效果。