タブのコンテンツを真ん中に置く

Question

こんにちは、みんな私のタブとすべてのコンテンツを中央に移動できません。

私はwidthなどを設定し、margin: 0 auto;のようなものを試してみましたが、あなたはすべてのタブのコンテンツを中心にしようとしている場合は何も

Fiddle

.tab-group{ 
    margin: 0 auto; 

} 

Answer 1

を働いていない：

.tab-content { 
    text-align: center; 
} 

を編集：

私は最初の質問に誤解しました。あなたもこれを実行したいと思う：

.tab-group li { 
    display: inline-block; 
} 

最後に、あなたがinline-blockを追加した後、あなたのタブ間のわずかな隙間に気づくかもしれません。そのための迅速な修正は、<ul>の最後のものを除くすべての終了</li>を削除することです。これにより、inline-blockを使用しているときに、スペースが空白にならないようになります。

<ul class="tab-group"> 
    <li class="tab active"><a href="#signup">3D</a> 
    <li class="tab"><a href="#login">REF</a></li> 
</ul> 

終了タグを削除すると（それは一部の人を気に）あなたを気にした場合、あなたは常にだけで、手動ですべての空白を削除することができます。しかし私は、タブのためにそれを必要とするテキストのために働く

<ul class="tab-group"><li class="tab active"><a href="#signup">3D</a></li><li class="tab"><a href="#login">REF</a></li></ul> 

私は最初の方法のファンだ:)