我看过这里的其他示例,但找不到使它起作用的示例。我希望侧边栏(部分)在页面滚动时保持粘性。 如果我将position:sticky放在导航上,它就能起作用,因此我的浏览器肯定支持它。
main {
display: grid;
grid-template-columns: 20% 55% 25%;
grid-template-rows: 55px 1fr;
}
nav {
background: blue;
grid-row: 1;
grid-column: 1 / 4;
}
section {
background: grey;
grid-column: 1 / 2;
grid-row: 2;
position: sticky;
top: 0;
left: 0;
}
article {
background: yellow;
grid-column: 2 / 4;
}
article p {
padding-bottom: 1500px;
}
<main>
<nav></nav>
<section>
hi
</section>
<article>
<p>hi</p>
</article>
</main>