bootstrap pagewrapper_在中心Bootstrap 3网格旁边创建固定侧边栏

HTML

• Home
• Another link
• Next link
• Last link

CSS

#wrapper {

padding-left: 250px;

transition: all 0.4s ease 0s;

}

#sidebar-wrapper {

margin-left: -250px;

left: 250px;

width: 250px;

background: #CCC;

position: fixed;

height: 100%;

overflow-y: auto;

z-index: 1000;

transition: all 0.4s ease 0s;

}

#page-content-wrapper {

width: 100%;

}

.sidebar-nav {

position: absolute;

top: 0;

width: 250px;

list-style: none;

margin: 0;

padding: 0;

}

@media (max-width:767px) {

#wrapper {

padding-left: 0;

}

#sidebar-wrapper {

left: 0;

}

#wrapper.active {

position: relative;

left: 250px;

}

#wrapper.active #sidebar-wrapper {

left: 250px;

width: 250px;

transition: all 0.4s ease 0s;

}

}

的jsfiddle