h5元素行高等于其高度，在安卓系统下文字无法居中

h5元素行高等于其高度，在安卓系统下文字无法居中的问题（苹果正常）

徽章的样式： 

.my-badge
    display: inline-block;
    vertical-align: middle;
    min-width:20px;
    height: 20px;
    line-height: 20px;
    padding: 0 5px; 
    border-radius: 20px;
    font-size:10px;
    text-align: center;
    color:#fff;
    background: #f00;
}

如下图的徽章文字：

     '6'数字明显偏上

解决方案：

把字体大小改为12px就可以了

.my-badge{
    display: inline-block;
    vertical-align: middle;
    min-width:20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 20px;
    line-height: 20px;
    font-size:12px;
    text-align: center;
    color:#fff;
    background: #f00;
}

注意： 有好些设备不太兼容12px以下的字体！

修复后如下图：