实现如下图的任意列数的均匀布局效果，之前做这种效果都是用last-child去掉右边距来实现，这种方法ie8不支持，在博客中看到一种利用“text-justify和伪元素”就能实现的方法。

亲测后，果然简单有效；

 

上代码：

html布局代码：

     
    
      
        
       
        1
       
        
       
        2
       
        
       
        3
       
        
       
        4
       
        
       
        5
       
    
      
    
      
        
       
        1
       
        
       
        2
       
        
       
        3
       
        
       
        1
       
        
       
        2
       
        
       
        3
       
    
      
    
      
        
       
        1
       
        
       
        2
       
    
      
     

 

css代码： 

.container{
   width:800px; height:auto; overflow: hidden;border:1px solid #000;} .justify{
   text-align: justify;} .justify div{
               width:100px;            line-height:100px;            display:inline-block;            text-align:center;            background:#000;            color:#Fff;        }.justify:after {
               content: "";            display: inline-block;            position: relative;            width: 100%;        }