表格边框影响单元格大小

Question

有人能告诉我为什么当我将border=1放在桌子上时会修复其布局吗？

这就是问题所在：我写了一些让我成为组织结构图的JavaScript。如果我在制作图表的表格周围放置边框，那么一切都完美排列。如果我删除边框，一些线条的宽度变化很大（看似随机）。您将在连接组织结构图的红线中注意到这一点。

这是针对“border”的内联属性（例如<table border="1">）。

以下是两个演示：

Borders（很好，看起来都排成一列）：http://andrewvantran.com/table1.html

无边框（错误，全部未对齐）：http://andrewvantran.com/table2.html

我希望桌子的布局与边框一样，但我不想要边框！除非我保留边框（我不想要），否则我无法模拟带边框的表格布局。有什么想法吗？

Answer 1

您是否将表格设置为border-collapse:collapse;？从本质上讲，默认崩溃是separate，其中单元格有自己的边框。如果将其设置为折叠，则会合并并“看起来正确”

Answer 2

尝试将border-collapse: collapse;添加到样式表中。这似乎在你的情况下解决了很多。

除此之外，我建议你至少使用细胞的宽度。不同的浏览器处理单元格绘制如果指定宽度，则可以更加确定单元格对齐。在测试图形时，使用像Firebug这样的检查器工具来确定每个单元格的位置。这对你有很大帮助。