<table> border-collapse的影響：collapse;在IE瀏覽器中的盒子陰影

我創建了帶有空白標籤的表格，其中填充了一個盒子陰影。其簡單的html結構如下所示。<table> border-collapse的影響：collapse;在IE瀏覽器中的盒子陰影

<table> 
    <tr> 
     <td><span class="tokenHolder" data-ans="5" style="padding: 2px 53.5px;"></span></td> 
     <td><span class="tokenHolder" data-ans="5" style="padding: 2px 53.5px;"></span></td> 
    </tr> 
    <tr> 
     <td><span class="tokenHolder" data-ans="5" style="padding: 2px 53.5px;"></td></span> 
     <td><span class="tokenHolder" data-ans="5" style="padding: 2px 53.5px;"></span></td>  
    </tr> 
</table>

與下面的CSS代碼..

th { 
     font-size: 20px; 
     background-color: #cccccc; 
     padding: 5px 8px; 
    } 

    td { 
     padding: 5px 5px 10px 5px; 
     font-size: 18px; 
     background-color: #ececec; 
    }  

    th,td { 
     border-right: 2px solid #dedcdd;    
    }  

    table { 
     margin-top: 25px; 
     border: 2px solid #dedcdd; 
     position: relative;   
     border-collapse: collapse; 
    } 

    .tokenHolder { 
     background-color: white; 
     cursor: pointer; 
     position: relative; 
     color: transparent; 
     background-size: 100% 100%; 
     background-repeat: no-repeat; 
     box-shadow: 2px 2px 2px gray; 
     border-radius: 2px;   
    }

各自的JS小提琴是http://jsfiddle.net/Pank/4A9BM/

在這裏使用的邊界崩潰後：崩潰在表中刪除了盒子陰影跨度裏面..

否則孔代碼在所有瀏覽器中運行良好..

這即相關怪癖請幫助..

來源

2014-02-17 pank

Yeeee ...添加屬性規則=無，而不是使用border-collapse：collapse; – pank