这里拿出来讨论，可能在其他项目中没有碰到这样的需求或者无意中规避了这个问题
也或许已经有html&CSS高手把问题解决，都请来分享一下经验：
问题描述如下
因为客户不太懂技术，把上述td的宽度设置了百分比，然后为了好看又把里面的文本框也设置了width:100%，想让他自适应
更改之后变成这样
1 2 3 4 5 6
| th1 | 910 11 | 12th2 | 1314 15 | 16
|---|
| th1 | 2122 23 | 24 25
|---|---|
| th1 | 2829 30 | 31 32
| th1 | 3536 37 | 38 39
| th1 | 4243 44 | 45 46
| th1 | 4950 51 | 52 53
因为是老代码，这个画面恶心的地方首先是第一行和下面的各行不在一个table里，
图中的这个文本框对应的数据库表对应的字段是一个100位英文内容，如果满位输出的话，画面变成了这样。。
1 2 3 4 5 6
| th1 | 910 11 | 12th2 | 1314 15 | 16
|---|
| th1 | 2122 23 | 24 25
|---|---|
| th1 | 2829 30 | 31 32
| th1 | 3536 37 | 38 39
| th1 | 4243 44 | 45 46
| th1 | 4950 51 | 52 53
目测，这个文本框因为有一个maxlength=100,的设置，ie试图在允许的范围下，把内容全部显示，但是这样的话，画面就乱了，
测试环境是：IE 9，IE 8下也存在该问题，在chrome下完美解析，如下图：
所以据此推测是IE在解析INPUT上和chrome内核不太一致，但是现在开发是在IE8上进行，除了设置固定width和使用Js动态加载，有没有别的办法来兼容解决问题。。
注：style=“table-layout:fixed”我用过了，但是这个办法有点狠，不太适合
下载本文