揃え単語左右とセンター

Question

私はこのNAVを作るしようとしているが、私はすべての単語は、中央に1を適合させる方法がわからない、左右の

<nav class="barBox" target="_blank"> 
<a href="#" class="bar"><font color="lime"><b>Home</b></font></a> 
<a href="#" class="bar"><font color="lime"><b>Forums</b></font></a> 
<a href="#" class="bar"><font color="lime"><b>Store</b></font></a> 
</nav> 

それは、家が左にあり、フォーラムが中央にあり、店が右にある間に、私は1行ですべてを作成しようとしているというコードです。すべて同じ行にある。

Answer 1

ポジショニングを使用できます。これは1つの可能な解決策にすぎません。

.barBox { 
 
    width: 100%; 
 
    position: relative; 
 
    text-align: center; 
 
    } 
 

 
.barBox a { 
 
    color: #fff; 
 
    background: #aaa; 
 
    padding: 5px 10px; 
 
    display: inline-block; 
 
    font-weight: bold; 
 
    text-decoration: none; 
 
    } 
 

 
.barBox a:first-child { 
 
    position: absolute; 
 
    left:0; 
 
} 
 

 
.barBox a:last-child { 
 
    position: absolute; 
 
    right:0; 
 
}

<nav class="barBox" target="_blank"> 
 
<a href="#" class="bar">Home</a> 
 
<a href="#" class="bar">Forums</a> 
 
<a href="#" class="bar">Store</a> 
 
</nav>

注私は、彼らがここ数年のために推奨されていません.... fontとbタグを削除しました。

Answer 2

これはまったく役に立ちますか？使用

：

float: left //left 
margin: 0 auto; //center 
right: 10px //push it to the right but can still see it 

少しハックが、ジョブが

https://jsfiddle.net/t20jjjz7/1/