Cssダーツの角度2の素材コンポーネント。グリフを中央に揃えるにはどうすればいいですか？

Question

HTML：

<div class="border"> 
    <glyph class="center" [icon]="'star'" ></glyph> 

    <div class="centerText"> 
     This Is Text that is centered. 
    </div> 
</div> 

のCss：

.centerText{ 
    text-align: center; 

} 

.border{ 
    border: solid black; 
    width: 80px; 
} 

.center{ 
    margin-left: 50%; 
} 

結果：私は中央にはどうすればよいhttps://github.com/dart-lang/angular2_components

からグリフのアイコンを中心にしようとしています

グリフ？マージン左は一種のそれを中心にされたインラインフレックス

が、幅が小さい場合には、悪いなります>ディスプレイ -

https://github.com/dart-lang/angular2_components/blob/master/lib/src/components/glyph/glyph.scss.cssでコードがCSSのフレキシボックスを使用しています。

text-align: center 

と

align-items: center; 
justify-content: center; 

とmicronyks提案ごとに動作します。この

display:block; 
margin:auto; 

Answer 1

：

<div class="border"> 
    <div class="centerText"> 
     <glyph [icon]="'star'" ></glyph> 
    </div> 
    <div class="centerText"> 
     This Is Text that is centered. 
    </div> 
</div>