Question

我有一个div，我希望将其设置为100％的高度，我知道如果div的高度为高，则div只能有一个百分比高度。我有一个表，它所在的列可以有不同的高度，具体取决于行中其他列的内容。那么如果td必须有100％的高度，我怎么还有一个100％高度的div？我还必须设置表格行高吗？如果是这样，我该怎么做，因为行的高度可以改变。

  <table width="100%">
    <tr style="min-height:90px;">
      <td width="500px" class="innerBox2">
        INFO HERE (THIS IS THE COLUMN THAT CAN CHANGE THE HEIGHT DEPENDING ON HOW MUCH INFO IS IN HERE)
      </td>
      <td width="90px" style="height:100%" align="center" class="innerBox">
        <div class="innerBox2" style="height:100%">
          THIS IS THE DIV IM ASKING ABOUT
        </div>
      </td>
    </tr>
  </table>

Answer 1

如果您希望单元格中的div拥有100％的表格并且您不知道或不想在表格上设置高度，则可以始终执行此操作：

http://jsfiddle.net/2R9sm/

的CSS：

.innerBox2{
    background:#999;
    position:absolute;
    top:0;
    bottom:0;
    overflow:hidden;
}
.innerBox1{
    background:#333;
}
table{
    position:relative;
}

HTML：

<table width="100%">
    <tr style="min-height:90px;">
      <td width="500px" class="innerBox1">
        INFO HERE (THIS IS THE COLUMN THAT CAN CHANGE THE HEIGHT DEPENDING ON HOW MUCH INFO IS IN HERE)
      </td>
      <td width="90px" style="height:100%" align="center" class="innerBox">
        <div class="innerBox2" style="height:100%">
          THIS IS THE DIV IM ASKING ABOUT
        </div>
      </td>
    </tr>
  </table>

基本上，position:absolute上使用div bottom:0; top:0; position:relative会使{{1}}父项的{100}（本例中为表格）

设置高度为100％

1 个答案: