Chrome 1px不可避免td之間的間距

我遇到的問題似乎只發生在Chrome和其他地方。我有一張桌子，在懸停時應用了一個樣式。在其他瀏覽器中，當將鼠標懸停在行的任何部分上時，都會應用該樣式。但是，在鉻中，在每個td的邊緣，樣式不再適用。如果我在單元格之間的這個小1px寬區域上「檢查元素」，元素窗格顯示Chrome認爲我在表格內，但不在行內。下面是一些產生這種效果的代碼：Chrome 1px不可避免td之間的間距

CSS：

table.tablesorter tbody tr:hover { 
    background: #8dbdd8; 
    cursor: pointer; 
} 

table { 
    border-collapse: collapse; 
    border-spacing: 0px; 
    border: none; 
}

HTML：

<table id="myTable" class="tablesorter"> 
     <thead> 
      <tr> 
       <th>Title1</th> 
       <th>Title2</th> 
       <th>Title3</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Bach</td> 
       <td>42526</td> 
       <td>Dec 10, 2002 5:14 AM</td> 
      </tr> 
      <tr> 
       <td>Doe</td> 
       <td>243155</td> 
       <td>Jan 18, 2007 9:12 AM</td> 
      </tr> 
      <tr> 
       <td>Conway</td> 
       <td>35263</td> 
       <td>Jan 18, 2001 9:12 AM</td> 
      </tr> 
     </tbody> 
    </table>

有人見過這個/知道變通的辦法？

如果有幫助，我使用Chrome 13.0.782.220。

現場演示：http://jsfiddle.net/yNPtU/

來源

2011-09-12 James

的可能的複製[失落：上的之間在Chrome懸停狀態（http://stackoverflow.com/a/10638935/1015609） –

有同樣的問題，沒有解決方案，除了髒-1px定位。它實際上是0.5px，而不是1px。 –

-3

給邊框間距：在CSS -1px。

來源

2011-09-12 11:01:38

由於其可能的解決方案，不能解決問題... –

有趣的是，這不是由邊界造成的。如果將邊框寬度設置爲10px，則在導致此問題的單元格之間仍然只有1px。

我試圖設置tds的位置似乎工作。這裏是一個演示：http://jsfiddle.net/lnrb0b/6harr/

注：我已經添加填充在保持尺寸一致

來源

2011-09-12 16:40:29 lnrbob

+1。但可能會對其他瀏覽器產生一些負面影響，並且由於位置相對計算，肯定會對渲染性能產生一些負面影響。 –

正如this question提到的，這將解決這個問題：

td { 
    padding: 2px 5px; 
    position:relative; 
}

而且JsFiddle 。

來源

2012-08-23 01:50:56 Izhaki

-1

默認情況下，表格具有cellpadding和cellspacing。您將需要添加：

<table cellspacing="0" cellpadding="0">

來源

2016-04-12 08:42:07

Chrome 1px不可避免td之間的間距

回答

相關問題