Question

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

Answer 1

如果父元素没有设置高度，则无法在元素上设置height:100%;。

只需设置td { height: 30px; }即可。

实际上，我的上一个链接无效。经过一些研究，似乎没有一些JavaScript就无法达到你想要的效果。但正如你所说，你试图使用JavaScript，所以我认为这应该是你正在寻找的：Answer to the same kind of question（看看它的小提琴。）看起来，你将无法做出选择。

Answer 2

您可以将position:absolute设置为输入。

Here一个小提琴示例（请注意，您还必须为包含输入的<td>设置宽度）：

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

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

在Firefox和Chrome上测试

更新：在资源管理器中不起作用，您可以为输入设置最小高度，使其至少可用。

UPDATE2：对于Dracco，here实施您的示例的小提琴。

Answer 3

以某种方式将工作台高度设置为100％即可。

css：

table {height: 100%;}
input {height: 100%;}

html：

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

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

3 个答案: