溢出:即使设置了高度也无法自动工作

时间:2014-11-22 18:58:58

标签: javascript html css

在创建网站的过程中,我建立了一个例外持有者,用于存储每个抛出的异常。

我想让它滚动而不是扩展网页,如果出现太多问题。

我使用CSS和overflow:auto来改变#error元素。

The website

#error {
  color:red;
  display:table;
  border:1px solid black;
  border-color:black;
  height:750px;
  width:10em;
  overflow:auto;
  white-space:nowrap;
}
#important{
  vertical-align:top;
  border-collapse:separate;
}
<table>
  <tr>
    <td id='error'>
      <div>
        <center>Errors:</center>
      </div>
    </td>
    <td id='important'>
      Everything here is important. Everything. Please wait while we load.
    </td>
  </tr>
</table>

1 个答案:

答案 0 :(得分:1)

display:table;移除#error并将id='error'移至嵌套div。它将解决问题。

#error {
  color: red;
  border: 1px solid black;
  border-color: black;
  height: 10px;
  width: 10em;
  overflow: auto;
  white-space: nowrap;
}
#important {
  vertical-align: top;
  border-collapse: separate;
}
<table>
  <tr>
    <td>
      <div id='error'>
        <center>
          Errors:
          <br/><br/><br/><br/>
          AAA
        </center>
      </div>
    </td>
    <td id='important'>
      Everything here is important. Everything. Please wait while we load.
    </td>
  </tr>
</table>