HTML表格栏宽度不一致

Question

如何将html表格宽度设置为一致。 例如在下面的jsbin中，列1,2,4和5具有行跨度1和列跨度2，但是为什么3和4的列宽比列1和2宽。

示例如下：

 .tg {border-collapse:collapse;border-spacing:0;} .tg td{font-family:Arial, sans-serif;font-size:11px;padding:11px 5px;border-style:solid;border-width:1px;text-align:center;width:100px} .tg .noborder{border-style:none;} .tg .tg-943m{background-color:#656565} .tg .tg-7a16{background-color:#fffc9e} @media screen and (max-width:1000px) { .tg {width: auto !important;} .tg col {width: auto !important;} .tg-wrap {overflow-x: auto;-webkit-overflow-scrolling: touch;}} 

 <div class=tg-wrap><table id=myTable class=tg><tr> <td nowrap colspan= 2 rowspan= 1 > DA-09-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-09-18 </td> <td nowrap colspan= 1 rowspan= 9 > E </td> <td nowrap colspan= 2 rowspan= 1 > DA-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-09-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-09-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-09-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-68 </td> <td nowrap colspan= 1 rowspan= 9 > C </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-08-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-08-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-08-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-08-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-08-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-08-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-08-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-08-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-08-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-08-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-08-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-08-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-07-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-07-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-07-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-07-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-07-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-07-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-07-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-07-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-07-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-07-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-07-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-07-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-06-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-06-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-06-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-06-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-06-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-06-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-06-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-06-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-06-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-06-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-06-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-06-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-05-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-05-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-05-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-05-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-05-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-05-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-05-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-05-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-05-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-05-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-05-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-05-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-3A-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-3A-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-3A-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-3A-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-3A-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-3A-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-3A-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-3A-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-3A-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-3A-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-3A-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-3A-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-03-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-03-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-03-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-03-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-03-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-03-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-03-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-03-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-03-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-03-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-03-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-03-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-02-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-02-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-02-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-02-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-02-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-02-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-02-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-02-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-02-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-02-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-02-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-02-118 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DA-01-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-01-18 </td> <td nowrap colspan= 2 rowspan= 1 > DA-01-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-01-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-01-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-01-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-01-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-01-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-01-68 </td> <td nowrap colspan= 2 rowspan= 1 > DB-01-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-01-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-01-118 </td> </tr><tr> <td class=noborder></td></tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-09-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-09-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-09-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-09-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-09-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-08-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-08-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-08-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-08-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-08-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-08-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-08-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-08-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-08-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-08-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-08-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-07-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-07-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-07-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-07-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-07-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-07-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-07-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-07-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-07-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-07-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-07-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-06-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-06-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-06-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-06-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-06-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-06-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-06-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-06-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-06-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-06-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-06-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-05-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-05-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-05-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-05-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-05-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-05-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-05-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-05-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-05-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-05-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-05-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-3A-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-3A-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-3A-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-3A-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-3A-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-3A-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-3A-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-3A-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-3A-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-3A-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-3A-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-03-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-03-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-03-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-03-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-03-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-03-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-03-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-03-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-03-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-03-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-03-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-02-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-02-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-02-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-02-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-02-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-02-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-02-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-02-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-02-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-02-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-02-128 </td> </tr><tr> <td nowrap colspan= 2 rowspan= 1 > DD-01-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-01-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-01-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-01-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-01-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-01-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-01-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-01-88 </td> <td nowrap colspan= 1 rowspan= 1 > SE-01-98 </td> <td nowrap colspan= 1 rowspan= 1 > SE-01-118 </td> <td nowrap colspan= 1 rowspan= 1 > SE-01-128 </td> </tr></table></div> 

屏幕截图示例如下：第1列，第2列和第4列具有相同的属性col span 2，但是在我看来为什么宽度不一致。 截图示例

样本预期输出 原始js bin

Answer 1

我不确定要更改哪些列。

但是，带有“ E”的列的colspan仅为1。这使下部表格部分的第三列跨到顶部列的一半。

VIRTUAL COLUMNS     |1 2 |3 4 |5 |6 5
TOP COLUMN WIDTHS   |2   |2   |1 |2   
LOWER COLUMNS       |2   |2   |2   |

将“ E”列的colspan更改为2会有所帮助。

Answer 2

首先，在CSS样式中，将TD宽度设置为100％。 HTML表格不能很好地处理百分比宽度。
如果可能，尝试将其设置为像素。

.tg td{ width:100px }

其次，您在表格行258上有一个空的TR标记，该标记没有列也没有colspan。 那使你的桌子坏了。

第三，表格的第二部分上的列过多。 尝试删除其中3个，或固定colspan计数。

 <style> .tg {border-collapse:collapse;border-spacing:0;} .tg td{font-family:Arial, sans-serif;font-size:11px;padding:11px 5px;border-style:solid;border-width:1px;text-align:center;width:100%} .tg .tg-943m{background-color:#656565} .tg .tg-7a16{background-color:#fffc9e} @media screen and (max-width:1000px) { .tg {width: auto !important;} .tg col {width: auto !important;} .tg-wrap {overflow-x: auto;-webkit-overflow-scrolling: touch;}} </style> 

 <div class=tg-wrap> <table id=myTable class=tg> <tr> <td nowrap colspan= 2 rowspan= 1 > DA-09-08 </td> <td nowrap colspan= 2 rowspan= 1 > DA-09-18 </td> <td nowrap colspan= 1 rowspan= 9 > E </td> <td nowrap colspan= 2 rowspan= 1 > DA-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DA-09-38 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 1 rowspan= 1 > SB-09-08 </td> <td nowrap colspan= 1 rowspan= 1 > SB-09-18 </td> <td nowrap colspan= 1 rowspan= 1 > SB-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-38 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-68 </td> <td nowrap colspan= 1 rowspan= 9 > C </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-88 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-98 </td> <td nowrap colspan= 2 rowspan= 1 > DB-09-118 </td> </tr> <tr> <td nowrap colspan= 2 rowspan= 1 > DD-09-08 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-18 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-38 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-68 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-88 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-98 </td> <td nowrap colspan= 2 rowspan= 1 > DD-09-118 </td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td class=noborder></td> <td nowrap colspan= 2 rowspan= 1 > DE-09-08 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-18 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-28 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-38 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-68 </td> <td nowrap colspan= 2 rowspan= 1 > DE-09-88 </td> </tr> </table> </div>