为什么我的内容被切断而没有滚动选项？

Question

我正在写一个小型网站来学习HTML和CSS，并且无法让我的内容向任何方向滚动。

当浏览器窗口被调整到任何内容不适合的地步，而不是允许滚动时，它就会消失。登录按钮的div应该从左侧出现950px。这意味着如果浏览器窗口比那个更小，它将允许您滚动，对吧？

新闻框将显示任何写入的内容，直到它到达浏览器窗口的底部。然后它不会滚动或显示。

有什么建议吗？

HTML是here在这里，CSS是here。

Answer 1

您的CSS中有很多position:fixed属性。当对象的position设置为fixed时，即使您正在滚动，它也会保持静止。因此，没有什么可以移动的，所以你不能滚动。试着改变你的CSS以下几点：

body { 
background-color: #222222; 
overflow: auto; 
color: #ffffff; 
font-family: verdana, sans-serif; 
} 
a { color: #ffffff; } 
a:visited { color: #ffffff; } 

#page_header { 
margin-top: 55px; 
margin-left: 100px; 
font-size: 50px; 
} 

#user_info { 
/*right: 50px;*/ 
left: 950px; 
top: 60px; 
position:absolute; 
} 
#user_info a { 
padding: 15px; 
text-decoration: none; 
font-size: 35px; 
} 
#user_info a:hover { 
background-color: #606060; 
} 

#boxes { 
margin-top: 100px; 
margin-left: 100px; 
} 

#left_content_box { 
padding: 20px; 
background-color: #00cdcd; 
width: 600px; 
float: left; 
} 
#left_content_box header { 
top: 15px; 
left: 50px; 
font-size: 25px; 
} 
#left_content_box section { 
padding: 10px; 
} 
#left_content_box section header { 
padding-top: 25px; 
position: relative; 
font-size: 20px; 
left: 0px; 
} 
#left_content_box section p { 
position: relative; 
top: 20px; 
left: 10px; 
font-size: 15px; 
overflow: auto; 
} 

这将让一切都在相同的位置，因为它是，除了页面现在可以滚动时，浏览器被调整到一个点，它不能显示其全部内容。