表格单元格不需要100％的高度

Question

我有： http://jsfiddle.net/#&togetherjs=8b9rFEijb5

<table>
<tr >
    <td> 
        <b> this </b><br/>
        <b>is</b><br/>
        <b>long</b><br/>
         text
    </td>
    <td>
       <table style='height:100%'>
           <tr style='height:100%'><td style='background-color:red;height:100%;width:100%;' > &nbsp;</td></tr>
           <tr style='height:100%'><td style='background-color:green;height:100%;width:100%;'> &nbsp;</td></tr>
        </table>
    </td>
</tr>

我希望右侧单元格中的表格占用所有可用空间。我希望height:100%表示从父标记中获取所有可用高度 - 但这似乎不正确。

Answer 1

试试这个。当左td内部文本被修复时，这很有用。

＆＃13;

＆＃13;

table td {
  border: 1px solid Red;
}

.one {
  background-color: red;
}

.two {
  background-color: green;
}

table table {
  height: 73px;
}

＆＃13;

<table>
  <tr>
    <td>
      <b> this </b>
      <br/>
      <b>is</b>
      <br/>
      <b>long</b>
      <br/>text
    </td>
    <td>
      <table>
        <tr>
          <td class="one">&nbsp;</td>
        </tr>
        <tr>
          <td class="two">&nbsp;</td>
        </tr>
      </table>
    </td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;