MDLアイコンオフセンター

Question

は、私は完璧にフィットアイコンを持っていますが、時々、私のアイコンが中心から外れていると、カットオフを得る：

<button hidden id="sign-up-float-icon" class="floater mdl-button mdl-js-button mdl-button--icon"> 
     <i class="material-icons">more_vert</i> 
    </button> 

    <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="sign-up-float-icon"> 
     <li class="mdl-menu__item" id="sign-up-email"> 
     Register with Email 
     </li> 
     <li class="mdl-menu__item" id="sign-in-google"> 
     Login with Google 
     </li> 
    </ul> 

顔アイコンがよさそうです。最も右の「オプション」アイコンがカットオフに見えます。ボタンをクリックすると、正常に動作しますが、正しく表示されません。どうしたの？私はmdlコンポーネントのdocとSOを読んでみましたが、まだ解決策を見つけることができませんでした。あなたの役に立つ答えを

おかげ

編集：

私は要素がどのように見えるかを含めました。あなたが見ることができるように、ボタンは整列していますが、イメージは少し上がっています。

は、いくつかのテストの後、問題が

Answer 1

CSS垂直整列は、この問題を解決することができ、コードに問題があることを確認することができます。 material-icons要素にクラスを追加し、開始するにはvertical-align: 15%;を適用するだけです。あなたが望むものが得られるまでその番号を変更してください。