HTML TD 宽度不生效答案

<td class="blue-table" width="375px" valign="top"> <table class="blue-table" cellspacing="0" cellpadding="0"> <tr> <td> <a href="#"><img src="http://www.mangemails.co.uk/wyleshardy/3rd-June-2014/slice_03.jpg" /></a> </td> </tr> <tr> <td class="blue-table" width="20px"></td> </tr> <tr> <td> <a href="#"><img src="http://www.mangemails.co.uk/wyleshardy/3rd-June-2014/slice_11.jpg" /></a> </td> </tr> <tr> <td> 8X4 Concrete Mixers 2006 (56) DAF FAD CF75.360 (Euro 4) 8x4 fitted with McPhee 8m3 Rapid Discharge Concrete Mixer, Serial No: 000962H, Build Date: 08/2006, Eaton 5433-080 PTO, Chutes, Flo Meter, Water Tank and Wash Down Hose, Cab and Rear Controls, Rear Camera (not in use), 8 Speed Manual Transmission, Cruise Control, Single Passenger Seat. etc. Odometer: c.180K Kms. Tested til: End of September 2014. 2004 (04) SCANIA 4 SERIES P114CB-380 8x4 fitted with Hymix 8m3 Rapid Discharge Concrete Mixer, Serial No: H90067, Build Date: 09/12/2003, Sauer HPM51-2 PTO, Chutes, Flo Meter, Water Tank and Wash Down Hose, Cab and Rear Electronic Controls, Brigade BE-255 Backeye Rear Camera and in Cab Monitor, 8 Speed Manual Transmission, Cruise Control, Single Passenger Seat, etc. Odometer: c.266K Kms. Test Expired: End of March 2014. </td> </tr> <tr> <td width="140px"> Cars 2011 (61) TOYOTA Verso 2.0 D4-D TR Panoramic Roof 7-Seat 5dr Manual – c.39K miles. </td> <td width="186px"><img src="http://www.mangemails.co.uk/wyleshardy/3rd-June-2014/slice_30.jpg" /></td> </tr> </table> </td>

【解决方案2】：

您的最后一行似乎有两个单元格 - 而在其上方的每一行中只有一个单元格。这意味着您的桌子实际上是两列宽，汽车的图片本身就在一个附加的列中。这会打乱宽度计算。

解决此问题的一种方法是使单单元格的行每列跨越两列，并保持两单元格的行不变。 colspan 会这样做，它的应用如下：

    <tr>
        <td colspan="2">
            <p><strong>8X4 Concrete Mixers</strong><br />
            <p>2006 (56) DAF FAD CF75.360 (Euro 4) 8x4 fitted with McPhee 8m3 Rapid Discharge Concrete Mixer, Serial No: 000962H, Build Date: 08/2006, Eaton 5433-080 PTO, Chutes, Flo Meter, Water Tank and Wash Down Hose, Cab and Rear Controls, Rear Camera (not in use), 8 Speed Manual Transmission, Cruise Control, Single Passenger Seat. etc. Odometer: c.180K Kms. Tested til: End of September 2014.</p><p>
            2004 (04) SCANIA 4 SERIES P114CB-380 8x4 fitted with Hymix 8m3 Rapid Discharge Concrete Mixer, Serial No: H90067, Build Date: 09/12/2003, Sauer HPM51-2 PTO, Chutes, Flo Meter, Water Tank and Wash Down Hose, Cab and Rear Electronic Controls, Brigade BE-255 Backeye Rear Camera and in Cab Monitor, 8 Speed Manual Transmission, Cruise Control, Single Passenger Seat, etc. Odometer: c.266K Kms. Test Expired: End of March 2014.
            </p>
            </p>
        </td>
    </tr>

您需要对每一行执行此操作。

这应该会给您的宽度设置带来更可预测的结果。

您可以通过使用 CSS 为表格单元格设置临时边框来仔细检查表格布局，如下所示：

td {
  border: 1px solid red;
}

编辑

可能更好的解决方案是使用 CSS 和 float: right 汽车图片（添加边距或填充以在其周围留出一些空间）。然后，您可以将<td class="blue-table" width="375px" valign="top"> 中的所有内容视为一组普通的段落和图像，并完全避免colspan。如果您有兴趣，这里有一篇关于使用表格进行布局的优点或其他方面的长文：Why not use tables for layout in HTML?

【讨论】：