overflow:hidden和display：inline-block在一起行内对不齐

同时拥有overflow hidden 和 display inline-block 的元素，会对行内元素垂直对齐 有影响，
导致原因是 overflow hidden 改变了默认对齐方式

解决办法：添加 vertical-align: bottom

参考文档：
http://stackoverflow.com/questions/20566710/overflowhidden-displayinline-block-moves-text-upwards

This happens because the inline-block element has height equal to its parent and overflow: hidden causes its bottom edge to be aligned on the text baseline of the parent. As a result the space that is available for descenders on the text is essentially doubled for the (JSFiddle).

You can fix this by also giving it vertical-align: bottom.

    
    
    



    北京
    BJ

转自：https://blog.csdn.net/isaisai/article/details/51219726