角度md按钮破坏对齐

问题描述：

当我不插入md-button时，一切都很完美。但是当我添加md-button时，span无法正常工作。数字“5”下降。我怎么解决这个问题？角度md按钮破坏对齐

HTML：

<button md-button class="special-orders">xüsusi təkliflər <span>5</span></button>

CSS：

.special-orders { 
    font-size: 15px; 
    color: white; 
    span { 
     font-size: 11px; 
     display:inline-block; 
     width: 15px; 
     height: 15px; 
     text-align: center; 
     color: #FF2868; 
     background-color: white; 
     border-radius: 50%; 
     vertical-align: middle; 
     padding: 0; 
    } 
    }

这是你如何使用MD按钮？我用它的方式是 xüsusitəkliflər – heysulo

我没有你所说的话，它给了这个错误：“MD-按钮”是不是一个已知元素 –

我的坏。它的Angular，而不是AngularJS – heysulo

答

材料造型设置按钮线路高度36px这似乎是导致与跨度问题具有固定的高度和宽度。设置跨度上的线高也比尝试将所有内容排成一行更容易。

.special-orders { 
     font-size: 15px; 
     color: white; 
     span { 
     line-height: 18px; 
     width: 18px; 
     display:inline-block; 
     text-align: center; 
     color: #FF2868; 
     background-color: white; 
     border-radius: 50%; 
     vertical-align: middle; 
     padding: 0; 
     } 
    }

角度md按钮破坏对齐

相关推荐