使用table html创建一个没有空格的网格

Question

我试图在html中建立一个网格，但我想删除我的单元格之间的空间，我找不到。

<table id="gameGrid" cellspacing="0" >
    <tr class="gridRow" >
        <td class="box" ></td>
        <td class="box" ></td>
        <td class="box" ></td>
    </tr>
    <tr class="gridRow" >
        <td class="box" ></td>
        <td class="box" ></td>
        <td class="box" ></td>
    </tr>
    <tr class="gridRow" >
        <td class="box" ></td>
        <td class="box" ></td>
        <td class="box" ></td>
    </tr>
</table>

和CSS:

#gameGrid{
border:1px solid black;
border-collapse: collapse;
padding:0;
margin:0;
border-spacing: 0;
} 
#gameGrid .gridRow{
margin:0;
padding:0;
}
#gameGrid .gridRow .box{
margin:0;
padding:0;
background-color:green;
height:16px;
width:16px;
display:inline-block;
}

示例:http://jsfiddle.net/sLG2D/1/

我看到了这个帖子，但没有工作如何在表中删除行和列之间不需要的空间?

Answer 1

从#gameGrid .gridRow .box中删除display:inline-block;规则

<<p> jsFiddle例子/strong>

Answer 2

您将显示您的td为inline-block。删除。