当执行某个用户操作时，我需要向包含 <input> 的表中添加一行在每个单元格中。我需要 <input> s 自动填充可用空间而不影响列宽。
我需要从这个开始:
最后是这样的:
但是，当我插入输入时，每一列都会拉伸(stretch)到至少 ~170 像素(取决于浏览器):
简化演示:http://codepen.io/patik/pen/qZXMyL — 单击底部的按钮，注意插入输入后如何不保留原始列宽。
我可以在插入输入之前读取列宽，然后手动应用 max-width对于每个输入，但是我希望该列保持流动(即，列应继续调整以适应纯文本数据)。可能会向表中添加或删除其他行，我需要相应地调整输入。
正如您将在演示中看到的，我已经尝试创建一个 <td><div><input></div></td>结构中希望 <div>将填充列和 <input>将填充 <div> ，但事实并非如此。
我更喜欢 CSS 解决方案(即使我需要在插入输入时应用内联样式)但如果 JavaScript 解决方案是唯一的选择，我会接受它。
最佳答案
<input> s 必须有一个 size如果你想用 CSS 控制它们的宽度属性:
<td><input size="1"></td>
size 的值无关紧要(尽管它确实需要一些值——您不能简单地编写 <input size> 并让它工作)。只要该属性存在，该元素似乎就会尊重我应用到它的任何 CSS。在这种情况下，width: 100%做的伎俩。
关于html - 如何防止输入元素影响表格的列宽？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36334325/