页面不会在任何浏览器中滚动——我使用的是过时的 CSS 吗？
自从我真正深入研究 CSS 编码以来已经大约五年了，所以我可能使用过时的代码；然而，除了滚动条之外，一切似乎都工作正常。虽然我可以向我创建的任何 div 元素添加滚动条，但它不允许页面滚动。我尝试添加溢出：auto;和溢出：滚动；我的身体标签的选项，但没有任何效果。我也包含了我正在使用的编码，但我已经仔细检查过我没有包含另一组滚动标签。谁能看出问题是什么吗？我担心我的 CSS 可能已经过时了，但我到处都说只使用溢出标签。谢谢！
另外，内容元素设置为比页面长，这样我就可以查看滚动条是否有效，但添加溢出：滚动;我的 body 标签使滚动条出现但不起作用。
编码：
<style>
body{background: #000000; font-family: tahoma;}
#content{position: fixed; top: 155px; left: 347px; overflow: auto;}
.content{height: 800px; width: 506px; color: #FFFFFF; overflow: auto;}
#navigation{position: fixed; top: 155px; left: 153px;}
.navigation{height: 643px; width: 184px; background: #000000;}
a:link{display: block; background: #A70000; font-family: tahoma; font-size: 14pt; text-decoration: none; color: #FFFFFF; border-left: 3px #D50000 solid; width:
180px; height: 25px; text-align: left; margin-bottom: 4px; text-indent: 6pt;}
a:hover{display: block; background: #A70000; font-family: tahoma; font-size: 14pt; text-decoration: underline; color: #FFFFFF; border-left: 3px #D50000 solid;
width: 180px; height: 25px; text-align: left; margin-bottom: 4px; text-indent: 6pt;}
</style>
It's been about five years since I really got hands-deep into CSS coding, so I may be using outdated codes; however, everything seems to work fine but the scroll bar. Although I can add scroll bars to any div element I create, it won't allow the page to scroll. I've tried adding the overflow: auto; and overflow: scroll; options to my body tag but nothing works. I've included the coding I'm using as well, but I've double and triple checked that I haven't included another set of scroll tags. Can anyone see what the problem is? I'm afraid my CSS might be out of date, but everywhere I look says to just use the overflow tags. Thanks!
Also, the content element is set to be longer than the page so I can see if my scroll bar works, but adding overflow: scroll; to my body tag makes a scrollbar appear but not function.
CODING:
<style>
body{background: #000000; font-family: tahoma;}
#content{position: fixed; top: 155px; left: 347px; overflow: auto;}
.content{height: 800px; width: 506px; color: #FFFFFF; overflow: auto;}
#navigation{position: fixed; top: 155px; left: 153px;}
.navigation{height: 643px; width: 184px; background: #000000;}
a:link{display: block; background: #A70000; font-family: tahoma; font-size: 14pt; text-decoration: none; color: #FFFFFF; border-left: 3px #D50000 solid; width:
180px; height: 25px; text-align: left; margin-bottom: 4px; text-indent: 6pt;}
a:hover{display: block; background: #A70000; font-family: tahoma; font-size: 14pt; text-decoration: underline; color: #FFFFFF; border-left: 3px #D50000 solid;
width: 180px; height: 25px; text-align: left; margin-bottom: 4px; text-indent: 6pt;}
</style>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
问题似乎与位置有关：已修复；
position:relative 将允许内容滚动。
http://jsfiddle.net/fMhCQ/13/
The issue appears to be with position: fixed;
position: relative would allow the content to scroll.
http://jsfiddle.net/fMhCQ/13/