ボタングループの中央揃え

Question

MTMLページの下部に3つのボタンを中央に配置しようとしていますが、何を試してもそれらを中央に置くことはできません。以下は私の最後の試みです。どんな助けにも感謝！

HTMLコード：

<div style="margin-left: auto;margin-right: auto"> 
<div class="btn-group"> 
    <a href="#" class="button">Top</a> 
    <a href="page2.htm" class="button">Page Two</a> 
    <a href="page3.htm" class="button">Page Three</a> 
</div> 
</div> 

CSSコード：

.btn-group .button { 
    background-color: #4CAF50; /* Green */ 
    border: none; 
    color: white; 
    padding: 15px 32px; 
    text-align: center; 
    text-decoration: none; 

    font-size: 16px; 
    cursor: pointer; 
} 

Answer 1

あなただけのセンターがあなたの親のdiv

text-align: center; 

に合わせ適用される次のフィドルに私の答えをチェックする必要があります： https://jsfiddle.net/9bm1n9vb/

私はインラインCSSを避ける​​ためだけに新しいCSSクラスを作成しました;）