0

无法从论坛中找到任何好的答案。我在 td 情况下有一张桌子,我无法以某种方式避免。IE 会忽略表格的“高度:100%”样式并采用可能的最小高度。虽然 ff 扩展了表格高度以适应 td

在 IE 8 或更高版本中运行这个小提琴。我希望红线能够延伸文本的整个高度。 http://jsfiddle.net/VKG3f/

<html lang="en-US" dir="ltr">
<head><style>
.line
{
    width: 5px;
    height: 100%;
    display: table-cell;
    min-height: 10px;
    max-width: 5px;
    background-repeat: repeat;
    background-color: red;
}
.text
{
    text-align: left;
    padding-top: 2px;
    padding-right: 2px;
    padding-bottom: 2px;
    padding-left: 2px;
    max-width: 100px;
}
body
{
    margin-top: 8px;
}

</style></head>
<body ><div id="d1">
<table border="0" cellspacing="0" cellpadding="0" summary=""><tbody>
<tr>
 <td style="height: 100%">
  <table border="0" cellspacing="0" cellpadding="0" summary="" style="height: 100%;  overflow:scroll;">
   <tbody>
    <tr>
     <td class="line">
      <div class="line">
       <span class=""></span>
      </div>
     </td>
    </tr>
   </tbody>
  </table>
 </td>
 <td>
  <div class="text">
   <a title="Current Step: This is a very long text which might even go to six lines and is done to check wrapping" 
   href="#">This is a very long text which might even go to six lines and is done to check wrapping</a>
  </div>
 </td>
</tr>

</tbody></table></div></div></div></form></div></body></html>
4

1 回答 1

0

你需要给height:100%body,html为父 div

body, html
{
    margin-top: 8px; height:100%
}
table, #d1{
    height:100%
}

演示

于 2013-05-22T10:23:49.727 回答