드롭다운 메뉴를 만들기 위해 고정된 크기의 div의 스타일을 아래와 같이 설정하고 div 내부에서 position: absolute;인 div를 만들면 드롭다운이 부모 div의 max-height를 벗어나면 y축으로도 스크롤바가 생기는 문제가 발생합니다.
div {
overflow-x: auto;
overflow-y: visible;
} 이 문제는 overflow-x와 overflow-y중 하나가 visible이면서 나머지 하나가 scroll 또는 auto일 수 없다고 W3C 스펙에 명시되어있기 때문입니다. 따라서 위의 코드는 실제로는
overflow-x: auto;
overflow-y: auto;로 적용되고 있었던 겁니다.
이 문제를 해결하는 것은 비교적 간단한데, 부모 div에서 position: relative;를 제거해줌으로써 해결할 수 있습니다.