스크롤해도 따라와야 할 메뉴나 사이드바가 그냥 같이 올라가 버린다면, position: sticky가 안 먹히는 원인은 대부분 부모 요소의 overflow 설정, 빠진 top 값, 그리고 부모 높이 세 가지 중 하나입니다.
코드를 이것저것 바꿔 보기 전에 아래 순서대로 점검하면 대부분 몇 분 안에 원인을 찾을 수 있습니다.

1. 조상 요소에 overflow: hidden이 있는지

가장 흔한 원인입니다. 부모나 그 위의 조상 요소 중 하나라도 overflow가 hidden, auto, scroll이면 그 요소가 새 스크롤 영역이 됩니다. sticky는 그 안에서 고정되려고 하는데, 정작 그 영역은 스크롤되지 않으니 아무 일도 일어나지 않는 것처럼 보입니다. 리뉴얼 현장에서는 가로 넘침을 막으려고 전체 감싸는 div에 넣어 둔 overflow-x: hidden이 범인인 경우를 정말 자주 봅니다.

/* sticky를 막는 흔한 코드 */
.wrap { overflow-x: hidden; }

/* 가로 넘침만 자르고 sticky는 살리기 */
.wrap { overflow-x: clip; }

overflow: clip은 넘치는 부분을 잘라 내기만 하고 스크롤 영역은 만들지 않아서 sticky가 정상 동작합니다. 크롬, 사파리 16 이상, 파이어폭스 등 최신 브라우저에서 지원됩니다. 아주 오래된 브라우저까지 신경 써야 한다면 hidden을 넣은 위치를 sticky 요소 바깥쪽으로 옮기는 방법도 있습니다.

2. top 값을 빼먹지 않았는지

position: sticky만 쓰고 top(또는 bottom)을 지정하지 않으면 어디에서 멈출지 기준이 없어서 고정되지 않습니다. 상단 고정 헤더가 있는 사이트라면 그 높이만큼 띄워 주어야 메뉴가 헤더 밑에 가려지지 않습니다.

.side-menu {
  position: sticky;
  top: 80px; /* 고정 헤더 높이만큼 */
}

3. 부모 높이가 요소와 같지 않은지

sticky 요소는 부모 상자 밖으로는 나가지 못합니다. 부모 높이가 sticky 요소와 똑같으면 움직일 여유가 없으니 고정되지 않는 것처럼 보입니다. 특히 flex로 본문과 사이드바를 나란히 놓으면 사이드바가 본문 높이만큼 늘어나면서 이 문제가 생깁니다.

.layout { display: flex; }
.sidebar {
  align-self: flex-start; /* 늘어나지 않게 */
  position: sticky;
  top: 80px;
}

개발자 도구에서 sticky 요소를 선택한 뒤 부모 요소를 하나씩 올라가며 Computed 탭의 overflow 값을 확인하면 원인을 가장 빨리 찾을 수 있습니다.