html - 100% 高度 div 切断内部的 div

Question

我正在开发一个 100% 高度和宽度的网站。左侧有一个面板，右侧是可滚动的主要内容区域。

但是，在内容区域中，最后一个 div 被截断了。我不明白为什么。我已经在 Firefox 和 Chrome 上对此进行了测试，两者都在做同样的事情。

这是查看它的链接: 已删除

如您所见，它被截断了，添加较大的底部边距 (50px +) 似乎可以修复它，但这看起来很糟糕。

PS:不要担心图片丢失，因为我只上传了这个页面，并没有上传整个网站。

提前致谢

Answer 1

1. 高度:100%；在大多数浏览器中相当不一致。尽量避免它。
2. 我不完全确定您的布局通常是如何工作的，但是设置溢出:隐藏； CSS 重置中的所有内容从一开始就会让事情变得不稳定。

去掉“溢出:隐藏；”你可以看到问题所在。您的内容 Pane 与您 body 的高度相匹配，因此，您失去了页面底部“topBar”的高度。因为 Body 隐藏了溢出。