如何使流行的引导程序主题的左侧栏表现得像主要内容一样?
请参阅this example.
如您所见,“主要内容”正在滚动,但是左侧边栏和标题都是固定的。我该怎么办,以便左侧边栏与主要内容一起滚动(但仍为全高)?
最佳答案
首先,从顶部导航中删除您的左侧导航。因为,您需要修复顶部导航。如果将您的左侧导航栏放在顶部导航栏,它也会固定,这是您不想要的。
然后将.side-nav
fixed
的css更改为absolute
。下面的例子。
CSS--
@media (min-width: 768px)
.side-nav {
position: absolute;/* Changed*/
top: 51px;
left: 225px;
width: 225px;
margin-left: -225px;
border: none;
border-radius: 0;
overflow-y: auto;
background-color: #222;
}