制作一个高度= 100%的表格,以正确包含高度= 100%的div

Question

我有一张高度为100%的桌子和一个固定的位置.在其中我想要一个高度为100%的div,它可以在溢出时滚动.

问题是,如果我在div中放入的内容多于其高度可以采取的内容,则表开始表现得很奇怪.

滚动不会按预期显示,而是表格变得比屏幕更大.

请接受我的话,我确实需要div在桌子上; 这是出于布局目的,我没有打扰我的问题描述.

但这是我唯一的限制:最外面的元素需要是一个表,在其中的某个地方我想要div.如果你有一个建议,你将div嵌入其他元素,那么请告诉我!

但我希望你的建议至少在firefox中得到理想的结果.

并再澄清一下:我想要的结果是,如果div包含太多高度的内容,那么当外表保持放置时,滚动应该出现.

我在这里给你代码,你可以测试它.

<table style='position: fixed; left: 0px; top: 0px; height: 100%;'>
  <tr><td style='height: 100%;'>
    <div style='height: 100%; overflow: auto;'>
      FRODO!
      <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
      <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
      ...
      <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    </div>
  </td></tr>
</table>

多谢你们!

编辑:回答你的答案.

Valamo:div上的overflow = auto意味着滚动在需要之前是不可见的,因此它们应该可以工作.但只是为了确保我已经尝试过overflow = scroll,以及许多其他的东西.我没有看到设置doctype将如何改变这种情况.

Ettiene:将div设置为高度= 100%,然后在其中放入另一个div并设置其高度= 100%和overflow = auto,然后我对内部div没有任何问题; 当它的内容太多时,它将显示滚动而外部div保持不变.但是如果用桌子替换外部div,那么你就会遇到问题.因此,仅将元素高度设置为100%不是问题.

还有什么想法吗？:-)

Answer 1

要使内容滚动，您需要使用overflow:scroll;

还要确保您使用文档类型。