CSS UL列表選項卡問題

Question

我創建了以下內容

而且我不知道如何固定標簽之間的間距。

也許解決方案非常簡單，但我無法弄清楚。

我嘗試了幾種方法，但找不到解決方案。

請問這有什么問題嗎？

在這里您可以找到代碼： http : //jsfiddle.net/SFw6V/

Answer 1

問題在tabs li類中

問題： display:inline-block向右添加額外的邊距

兩種解決方案：

1. display:block和float:left
2. margin-right:-4px;

工作小提琴： http : //jsfiddle.net/surendraVsingh/SFw6V/2/

詳細說明和不同的解決方案： http : //css-tricks.com/fighting-the-space-between-inline-block-elements/

Answer 2

它們之間有一個空白，因為有一個空白字符（空格， ） 它們之間：

<ul class='tabs'>
    <li data-tab="#tab1">
        Tab 1
    </li><li data-tab="#tab2"> <!-- remove spaces -->
        Tab 2
    </li><li data-tab="#tab3"> <!-- remove spaces -->
        Tab 3
    </li>
</ul>

http://jsfiddle.net/SFw6V/1/