表格单元格和行正在自动调整大小

Question

我正在建造一个扫雷游戏，我还包括一张10 * 10的桌子。我编程它，以便当用户点击“td”时，它显示任何内容，或“b”，或数字1-4。但是当它这样做时它也会调整（收缩），我该如何阻止它这样做呢？

表格的css

table{
border-collapse: collapse;
border-spacing: 0px;
border: 4px inset #444;
}

css for td

td {
margin: 0px;    
}

点击

之前

css

.box{
border: 3px outset #959595;
width:25px;
height: 25px;
}

这个css用于炸弹（“b”），没有任何东西和数字。（与那些不同的是颜色）

.bomb{
border: 1px dotted #000000;
width:25px;
height: 25px;
}

heres a link if that helps

Answer 1

点击后的css是什么？ 我认为它因为边界不同而重新调整大小

Answer 2

使用开发人员的工具非常仔细地测量您的盒子模型。您应该在<td>内使用一些填充，以便边框不会覆盖或与表重合。我的建议是在可能的display:block内容上使用<td>并设置边框，使其显示在表格的实际网格线中。