菜單選項卡內的空白？

enter image description here

我爲每個標籤的CSS是：

.tab1 
{ 
    color: white; 
    display: inline-block; 
    height: 110px; 
    width: 234px; 
    background-image: url("../images/first-tab.png"); 
    background-repeat:no-repeat; 
} 

.tab2 
{ 
    color: white; 
    display: inline-block; 
    height: 110px; 
    width: 234px; 
    background-image: url("../images/second-tab.png"); 
    background-repeat:no-repeat; 
} 

.tab3 
{ 
    color: white; 
    display: inline-block; 
    height: 110px; 
    width: 234px; 
    background-image: url("../images/last-tab.png"); 
    background-repeat:no-repeat; 
}

來源

2011-09-21 PD24

-1

內容的HTML您使用的？大多數元素都有默認的填充/邊距。在大多數情況下，你將不得不重寫這些。嘗試「margin：0; padding：0;」刪除它們或添加您的html示例。

來源

2011-09-21 08:38:06 JNDPNT

你的製表符是inline-block，而這個處理方式與inline幾乎相同，這意味着它們之間的空白符在html源代碼中它們之間的空格（空格，製表符或換行符）。

這會給你的「差距」：

<div class="tab1">Content here</div> 
<div class="tab2">Content here</div> 
<div class="tab3">Content here</div>

這不會：

<div class="tab1">Content here</div><div class="tab2">Content here</div><div class="tab3">Content here</div>

，這也不會：

<div class="tab1"> 
    Content here 
</div><div class="tab2"> 
    Content here 
</div><div class="tab3"> 
    Content here 
</div>

來改變這一狀況，更新你的HTML源代碼，並刪除空白或（更好）改變你的CSS使用block -elements和float:left （至極可能導致其他問題，但那是很難說的，因爲你沒有帶給你的HTML源代碼）

來源

2011-09-21 08:39:06 oezi

由於它們內嵌塊它們顯示它們之間的單一文本空間，如果他們之間有實際的空白在html中，所以要麼刪除html（醜陋的HTML）中的空格，要麼想到另一種解決方案來以這種方式顯示元素（例如浮動）。

來源

2011-09-21 08:39:20

菜單選項卡內的空白？

回答

相關問題