overflow:hidden；对inline-block元素的影响

• 一排元素以行内块元素的形式排列，其中有一个做超出隐藏处理overflow:hidden;
• 这时候其他元素会向下，造成不对齐的情况

html
   <div>
       <span>11</span>
       <span class="desc">22</span>
       <span>33</span>
       <span>44</span>
    </div>
 css
   span{
     display:inline-block;
   }
   .desc{
     overflow:hidden;
   }
   
 // 这时候另外的span元素会向下偏移；

• 原因：overflow:hidden的这个属性影响了inline-block元素baseline的位置；
• vertical-align属性的默认值时baseline

// 解决方案，修改vertical属性；
.desc{
     overflow:hidden;
     vertical:middle;
   }

that's all