如何使用flexbox制作的圣杯布局的侧边栏变粘？即.当最后一个元素到达时,html的旁边和导航部分应该停止向下滚动.我试过多种方法但收效甚微.
HTML:
<body>
<header>header</header>
<div id='main'>
<article>This area has lot of content </article>`
<nav> This nav should not scroll</nav>
<aside>This aside too</div></aside>
</div>
<footer>footer</footer>
</body>
CSS:
body {
/*font: 24px Helvetica;*/
background: #999999;
}
#main {
min-height: 800px;
margin: 0px;
padding: 0px;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row;
flex-flow: row;
}
#main > article {
margin: 4px;
padding: 5px;
border: 1px solid #cccc33;
border-radius: 7pt;
background: #dddd88;
-webkit-flex: 3 1 60%;
flex: 3 1 60%;
-webkit-order: 2;
order: 2;
} …