将输入高度设置为父级的100%

Question

设置输入(类型文本)高度以适应100%parent(td)高度我有一点问题.我甚至尝试迭代每个输入并使用jQuery手动设置它的高度,但它需要相当多的时间(我正在处理的网站有很多单元格)并且仍然无法在IE 7和8上工作(我有使网站在这些下工作).这是一个示例:http://st8.eu/test.html 如果有人知道任何解决方案/黑客,将不胜感激.

Answer 1

height:100%;如果父级没有设置高度,则无法设置元素.

只是设置td { height: 30px; }它应该工作.

实际上,我的上一个链接无效.经过一些研究,似乎没有一些JavaScript就无法达到你想要的效果.但正如你所说,你试图使用JavaScript,所以我认为这应该是你正在寻找的:回答同样的问题(看看它的小提琴.)看来,你将没有选择.

Answer 2

您可以设置position:absolute为输入.

这里是一个小提琴示例(请注意,您还必须为<td>包含输入的宽度设置):

input{
    position:absolute;
    top:0px;
    height:100%;
}
td{
    position:relative;
    width:200px;
}

它也适用于<input type="submit">和<div>.

在Firefox和Chrome上测试过

更新:在资源管理器中不起作用,您可以设置输入的最小高度,使其至少可用.

更新2:对于Dracco来说,这里是一个实现你的例子的小提琴.

Answer 3

以某种方式将表格高度设置为 100% 有效。

table {
  height: 100%;
}

input {
  height: 100%;
}

<table>
  <tr>
    <td> 1<br> 1 </td>
    <td> <input> </td>
  </tr>
</table>