拉伸输入字段高度以填充表格单元格答案

【问题标题】：Stretch input field height to fill table cell拉伸输入字段高度以填充表格单元格
【发布时间】：2013-03-25 00:47:17
【问题描述】：

如何使用 ie8 的纯 css 将输入字段拉伸到表格单元格的高度？

   <table>
    <tr>
        <td>line1<br />line2</td>
        <td><input type = "text" /></td>
    </tr>
</table>

height:100% 输入不起作用，以下组合也不起作用：

    height:inherit;
    display:inline-block;
    position:relative;

如果答案是你不能，那没关系，我会放一些 jquery 来做。

【问题讨论】：

标签： html css input height

【解决方案1】：

将padding:0添加到td，将height:100%添加到输入

input { 
    height:100%; 
    display:inline-block;
    position:relative;
}
td {        
    border:solid green 1px;
    background:pink;
    padding:0;
}

DEMO

【讨论】：

为了澄清一些混乱，这段代码可以在 Chrome 中运行，但不能在 Firefox 中运行。
这个例子有什么问题？当我模拟 IE8 时，我似乎无法让 JSFiddle 工作。

【解决方案2】：

将height:100%; 添加到您的输入中，并以百分比为单位设置 td 标记的高度

【讨论】：