角度のあるmdボタンで位置合わせが損なわれます

Question

md-buttonを挿入しないと、すべてが完全に機能します。しかし、md-buttonを追加すると、spanは正しく動作しません。数字「5」が下がります。どうすればこの問題を解決できますか？

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; 
    } 
    } 

Answer 1

材料スタイリングは、スパンの問題を引き起こしているように思わ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; 
     } 
    }