如何消除表格標籤生成的默認空間？

Question

html,body{ 
 
    width:100%; 
 
    height:100%;} 
 
tr{ 
 
    width:100%; 
 
    height: 10%; 
 
    float: left; 
 
} 
 
.col{ 
 
    width: 10%; 
 
    height: 100%; 
 
    float: left; 
 
} 
 
.odd{ 
 
    background-color: green; 
 
} 
 
.even{ 
 
    background-color: #fff; 
 
} 
 
#rw-one,#rw-three,#rw-five,#rw-seven,#rw-nine{ 
 
    /*width: 100%; 
 
    height: 100%;*/ 
 
    z-index: 999; 
 
    background-color: red; 
 
} 
 
table{ 
 
    width:100%; 
 
    height: 100%; 
 
    background-color: orange; 
 
    border:none; 
 
}

<table> 
 
    <tr id="rw-one"> 
 
    <td class="odd col"> </td> 
 
    <td class="even col"> </td> 
 
    <td class="odd col"> </td> 
 
    <td class="even col"> </td> 
 
    <td class="odd col"> </td> 
 
    <td class="even col"> </td> 
 
    <td class="odd col"> </td> 
 
    <td class="even col"> </td> 
 
    <td class="odd col"> </td> 
 
    <td class="even col"> </td> 
 
    </tr> 
 
    <tr id="rw-two"></tr> 
 
    <tr id="rw-three"></tr> 
 
    <tr id="rw-four"></tr> 
 
    <tr id="rw-five"></tr> 
 
    <tr id="rw-six"></tr> 
 
    <tr id="rw-seven"></tr> 
 
    <tr id="rw-eight"></tr> 
 
    <tr id="rw-nine"></tr> 
 
    <tr id="rw-ten"></tr> 
 
</table>

在上面的代碼我試圖創建一個表10行和第一行上有10 columns.the表具有width:100%;並且每行具有height:10%;和height:100%;。並且每行又被分成10份（寬度：每個10％），但10列不適合第一行。可能通過或標記生成一些默認空間，我該如何解決這個問題？

Answer 1

嘗試添加填充：0到您的.col類。

.col{ 
padding:0; 
width: 10%; 
height: 100%; 
float: left; 
} 

我認爲應該有效。看到這個codepen