DEV Community

Discussion on: How to make a sticky sidebar with two lines of CSS

Collapse
vlasterx profile image
Vladimir Jovanović • Edited on

"Fixed" is always fixed to the window coordinates, while "sticky" is displaying similar behavior like elements made with javascript. Solving this UI problem with CSS is always a better solution when it comes to UI performance.

Here is an example I found online: codepen.io/nyctophiliac/pen/xpmpyp

Worldwide adoption is 86%, so we may start to use it.

caniuse.com/#search=position%3Asticky

As always, only retarded Microsoft browsers are problematic.

Collapse
booligoosh profile image
Ethan

I understand the difference, however in the example the sidebar starts at the top anyway so there is no difference.

Thread Thread
vlasterx profile image
Vladimir Jovanović

Make window smaller and scroll up and down, so you will notice where is the difference.