为什么在此网页上不放置粘性工作？

Question

我希望此页面上的侧边栏表单-https://www.eventbrite.co.uk/blog/academy/event-marketing-strategy-ds00/-保持滚动状态。

我已添加

position: sticky;
top: 0;

到具有类item-single__sidebar的元素。

但是，这并没有任何改变。

任何人都可以解释为什么粘性在此页面上不起作用或提出替代解决方案吗？

Answer 1

侧边栏是flex子级，即位于display:flex元素内。因此，要保持粘性，您需要先对齐侧边栏。 另外，如果您设置top:0，则导航栏将覆盖边栏

尝试一下

position: sticky;
top: 80px;
align-self: flex-start;

通过类似问题My position: sticky element isn't sticky when using flexbox

查看此帖子