Sticky Sidebar in React

June 23, 2022Tagged: reactcss

Photo by Pixabay from Pexels: https://www.pexels.com/photo/art-blur-color-delicious-302163/

How to do it

Now you could use something like react-sticky to do something like this, but it’s so much easier to just define your sidebar using css.

#sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

You can change the top position to be any amount that would include your fixed header if you wanted to.


Profile picture

Written by Jelani Harris who lives and works in Wisconsin building useful things. You should follow them on Twitter