im new to sticky and i didn't use it before, so i copy & paste some codes (about sticky sidebar) into my project but it doesn't work.

<Layout title="Books">
      <div className="container w-100 row">
        <div className="sticky-top col-sm-3">
          <Filter />
        </div>
        <div className="col-sm-9 ">
          <Books />
        </div>
      </div>
      <Footer />
    </Layout>

CodePudding user response：

It's hard to tell without a live preview. But before using position: sticky; there are few things to remember:

1. position: sticky won't work if ancestor element has one of the following values for the overflow property: hidden, scroll, or auto
2. You must specify a threshold with at least one of top, right, bottom, or left for sticky positioning to behave as expected.