position-sticky(dreamcoding)

스티키는 기존에 들어있던 자리를 유지하다가 스크롤링 되면서 더 이상 보여지지 않는 시점에 사용자가 지정한 top left

포지션에 붙어 있고 또 하나 중요한 포인트는 그 자리를 그대로 공간을 유지하고 있어서 다른 요소들도 그 자리에 그대로 있다. fixed는 들어있는 부모와는 상관없이  뷰포트 안에서 포지션이 일어나기 때문에 빠져나온다

 

결론적으로 스티키를 쓸 때는 top left같은 포지션을 지정해 주어야 하고,

스티키는 또 있던 그 자리를 유지하면서

스크롤링이 될 때 고정이 되지만

fixed는 완전히 기존의 문서에서 나와서 상대적으로 뷰포트에서 포지션이 결정된다는 것

 

파란색이 fixed된 것이고, 나머지가 sticky속성 가짐