居中文本和縮小元素，以適應內嵌塊顯示的元素

Question

我目前正在爲我的網站創建一個導航欄，並且我到處尋找並嘗試了一些東西，但我無法弄清楚我已經搞砸了什麼：P

無論如何，我有一些我命名爲'nav-box'的盒子，它們內部包含導航元素。我有這些顯示內聯塊，使他們看起來像導航元素。

2件事現在，這些箱子裏面的文字都卡在箱子的左邊，我必須讓它們居中。除此之外，這些箱子看起來真的很大。我必須手動設置寬度，還是可以讓CSS讓它們合適？

這裏是我用我的代碼創建的JSFiddle。我試着加入「inline-block的」這兩個元素和它的父容器，但他們都沒有工作，針對這種情況:(

這是我已經試過：

.nav > .nav-content > .nav-inner { 
    width: auto; 
    float: right; 
    text-align: center; 
} 

正如你可以看到，在我的父元素拿着nav-box元素，我加了text-align: center;，但它仍然沒有做什麼，我需要。

http://jsfiddle.net/qhPwt/

Answer 1

箱子內的文本沒有對齊到中心，因爲有一個0將應用於框內的內容。

入住這FIDDLE

CSS改變

.nav > .nav-content > .nav-inner > .nav-box > .nav-link:last-child { 
    margin-right: 80px; // Remove this style 
}