删除问题。不再需要了。
答案 0 :(得分：0)
小提琴：https://jsfiddle.net/n2zb3pnz/5/
header {
overflow: auto;
bottom:0;
}
答案 1 :(得分：0)
这里有一些问题..
<header> html标记通常用作＆＃34;导航辅助工具＆＃34;的容器元素。对于某些包含元素（在您的情况下为<body>）。 From the docs：
HTML元素代表一组介绍或 导航设备。它可能包含一些标题元素以及其他元素 元素如徽标，包裹部分的标题，搜索表单等 上。
..所以，它在语义上不正确，但认为它通常被用作＆＃34;框架的顶部＆＃34;或页面上的框（不是侧边栏导航）
您的导航栏overflow属性设置为hidden - 这会阻止您正在寻找的滚动条。除了文档正文之外，它也没有父元素，因此除非您想要在导航栏上滚动，否则您需要添加一个带有overflow: auto;的父元素。
示例：
html, body{
height: 1000px;
width: 1000px;
}
.content{
height: 100%;
width: 100%;
overflow: auto;
background-color: pink;
}
.header {
display: block;
position: fixed;
left: 0;
top: 0;
width: 260px;
min-height: 100%;
padding: 0 0 0 50px;
background: #FFFFFF;
float: left;
overflow: hidden;
z-index: 9999;
}
.header .logo {
margin-top: 50px;
margin-left: -50px;
}
.header nav ul {
display: block;
overflow: hidden;
margin-top: 35px;
margin-left: -15px;
list-style: none;
}
.header nav ul li {
display: block;
margin-bottom: 30px;
margin-top: 50px;
}
.header nav ul li a {
color: #000000;
font-family:"raleway-regular", arial;
font-size: 20px;
text-decoration: none;
letter-spacing: 2px;
}
.header nav ul li a:hover {
color: #8AE6B8;
}
.header nav ul li a:active {
color: #CC99FF;
}
.transition {
width:50%;
height: 30px;
position: relative;
transition: 0.5s;
}
.transition:hover {
width:100%;
height: 30px;
position: relative;
transition: 0.5s;
}
.sideBar {
width:75%;
height: 100%;
position: relative;
padding:0px;
margin-left:20%;
}
.header .footer {
margin-top: 30%;
}
.header ul.social {
position: relative;
list-style: none;
margin-bottom: 5px;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
/* For Webkit browsers */
filter: gray;
/* For IE 6 - 9 */
-webkit-transition: all .7s ease;
/* Transition for Webkit browsers */
}
.header ul.social li {
display: block;
float: left;
position: relative;
margin: 0 15px 15px 4px;
}
.header ul.social li a {
display: block;
width: 30px;
height: 30px;
background-position: 0 0;
}
.header .rights p {
color: #000000;
font-family:"raleway-regular", arial;
font-size: 11px;
letter-spacing: 2px;
line-height: 18px;
}
.header .rights a {
font-family:"raleway-bold", arial;
font-weight: bold;
text-decoration: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content">
<div class="header">
<div class="logo"> <a href="index.html">
<img src="img/logo.png"/>
</a>
</div>
<!-- end logo -->
<div id="menu_icon"></div>
<nav>
<ul>
<div class="transition">
<div class="sideBar">
<li><a href="about.html" class="selected">About</a>
</li>
</div>
</div>
<div class="transition">
<div class="sideBar">
<li><a href="resume.html" class="selected">Resume</a>
</li>
</div>
</div>
<div class="transition">
<div class="sideBar">
<li><a href="skills.html" class="selected">Skills</a>
</li>
</div>
</div>
<div class="transition">
<div class="sideBar">
<li><a href="portfolio.html" class="selected">Portfolio</a>
</li>
</div>
</div>
<div class="transition">
<div class="sideBar">
<li><a href="gallery.html" class="selected">Map Gallery</a>
</li>
</div>
</div>
<div class="transition">
<div class="sideBar">
<li><a href="thesis.html" class="selected">Thesis</a>
</li>
</div>
</div>
<div class="transition">
<div class="sideBar">
<li><a href="contact.html" class="selected">Contact</a>
</li>
</div>
</div>
</ul>
</nav>
<!--end sidebar-->
<div class="footer clearfix">
<ul class="social clearfix">
<li><a href="mailto:md@outlook.com" class="email" target="_blank" data-title="Email"><img src="img/email.png"></a>
</li>
<li><a href="https://www.linkedin.com/pub/MD/b6/90b/26b?trk=pub-pbmap" class="linkedin" target="_blank" data-title="LinkedIn"><img src="img/linkedin.png"></a>
</li>
<li><a href="https://twitter.com/mD" class="twitter" target="_blank" data-title="Twitter"><img src="img/twitter.png"></a>
</li>
<li><a href="https://www.facebook.com/MD" class="facebook" target="_blank" data-title="Facebook"><img src="img/facebook.png"></a>
</li>
</ul>
<!-- end social -->
<div class="rights">
<p>Copyright © MD</p>
</div>
<!-- end rights -->
</div>
<!-- end footer -->
</div>
<!-- end header -->
</div>