[css] display:inline-block列表布局经常会遇到“换行符/空格间隙问题”

这样的双栏布局，感觉完美极了，

    
    
    
    
    



    

        

            

                
1
                
2
                
3
                
4
                
5
            
        
        

            
lorem
            
lorem
            
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quos aspernatur labore dolorum quibusdam
                reprehenderit quas similique, totam blanditiis facere eaque voluptatibus quasi distinctio? Facere magni
                quia, illo mollitia ad amet?
        

    

然而：

说好的inline呢？

看了这篇之后才发现，
css之display:inline-block布局

上面可以看到用了display:inline-block后，存在间隙问题，间隙为4像素，这个问题产生的原因是换行引起的，因为我们写标签时通常会在标签结束符后顺手打个回车，而回车会产生回车符，回车符相当于空白符，通常情况下，多个连续的空白符会合并成一个空白符，而产生“空白间隙”的真正原因就是这个让我们并不怎么注意的空白符。

原来是产生了空隙，将满满的25%+75%改为24%+75%，把背景颜色去掉看得更清楚一点：

这样就ok了：

酱婶的