CSS 设置table中td宽度失效

问题描述：当我们使用css对table中的td设置宽度的时候，td的宽度还是对于table的宽度自适应，没有达到设置宽度的效果。

<style type="text/css">
	table { 
		border: 1px solid #ddd; 
		font: 13px/25px "微软雅黑";
		table-layout: fixed;
		background-color: #fff;
	}
	table td { 
		border-right: 1px solid #ddd; 
		border-bottom: 1px solid #ddd; 
		overflow: hidden;
	}
	.td0, .td1 { width: 20px; text-align: center;}
	.td2, .td4 { width: 80px; text-align: center;}
	.td3, .td5 { width: 130px;}
</style>

<table cellspacing="0">
<tbody>
	<tr>
		<td rowspan="8" colspan="1" class="td0">交易双方信息</td>
		<tr>
			<td rowspan="4" colspan="1" class="td1">融出方</td>
			<tr>
				<td rowspan="1" colspan="1" class="td2">名称</td>
				<td rowspan="1" colspan="3">XXXX股份有限公司</td>
			</tr>
			<tr>
				<td rowspan="1" colspan="1" class="td2">场外结算<br>账号信息</td>
				<td rowspan="1" colspan="3">
					户名: XXXX股份有限公司<br>
					账号: XXXXXXXXXXXXXX225541<br>
					开户行: 中国工商银行广州市第一支行
				</td>
			</tr>
			<tr>
				<td rowspan="1" colspan="1" class="td2">证券账户</td>
				<td rowspan="1" colspan="3">深圳:XXXXXXXXX 上海:XXXXXXXXXX</td>
			</tr>
		</tr>
		<tr>
			<td rowspan="3" colspan="1" class="td1">融入方</td>
			<tr>
				<td rowspan="1" colspan="1" class="td2">客户名称</td>
				<td rowspan="1" colspan="1" class="td3"></td>
				<td rowspan="1" colspan="1" class="td4">证件号码</td>
				<td rowspan="1" colspan="1" class="td5">&nbsp;</td>
			</tr>
			<tr>
				<td rowspan="1" colspan="1">资金账号</td>
				<td rowspan="1" colspan="1"></td>
				<td rowspan="1" colspan="1">证券账户</td>
				<td rowspan="1" colspan="1">
					深圳:<br>
					上海:<br>
				</td>
			</tr>
		</tr>
	</tr>
</tbody>
</table>

 运行结果：

 IE6下结果

 IE8下结果

 

 chrome下结果

 Firefox下结果

 可以看到，宽度的设置在Firefox和chrome下是正常的，但是在表格结构比较复杂的情形下，chrome的宽度也有可能显示失效，在IE下宽度是一定会失效的。但是有一个元素的宽度在所有的浏览器中都是没有问题的，就是第一个td的宽度是正常的，为什么？

看看页面的DOM结构，如下图

 当设置宽度时，只有第一行即第一个tr中的宽度的是生效的，其他的宽度设置都是在后面的tr中的td都有问题，那么，如果将所有的td都放到第一个tr中设置，宽度会变得正常吗？

在原来的页面中加上thead部分，在这个tr中设置所有的td的宽度

<table cellspacing="0">
<thead>
	<tr>
		<th class="td0"></th>
		<th class="td1"></th>
		<th class="td2"></th>
		<th class="td3"></th>
		<th class="td4"></th>
		<th class="td5"></th>
	</tr>
</thead>
<tbody>

 在IE下的运行结果如下：

 

 在IE6和IE8下均显示正常了。

 

但是还是有问题存在：就是在chrome下这样做不正常，不知道为什么？