css固定宽度一行多列小技巧

1.要实现一行多列等距离分部，一个笨的方法设置每块的margin-right。最后一块将margin-right设置为0.

2.分享一个高大上的方法：先看下html的代码，我习惯用ul布局，当然用div 布局都也可以。

css代码：

#box ul li {
                width: 100px;
                height: 100px;
                background-color: green;
                float: left;
                margin-right: 10px;
                list-style: none;
            }

#box ul {
                width: 440px;
            }
           

 #box {
                width: 430px;     /*设置比ul的宽度小一个margin-right*/
                height: 200px;
                background-color: red;
                overflow: hidden;  /*再设置overflow为hidden即可*/
                margin: 100px;
            }

重点是红色字体部分。因为ul总宽度为440px（所有li的宽度加上margin-right的宽度）.只要在ul的最外面加个div 并设置其宽度为 ul 的宽度减去一个margin-right的值，并设置overflow为hidden.这样ul超出的10PX就被隐藏了。

效果图如下：