커스텀 슬라이더를 구현하는 과정에서, CSS의 hover 효과가 정상적으로 작동하지 않는 상황을 마주했다.상황슬라이더의 구조는 단순했다. {/* 회색 배경 */} {/* 흰색 진행 바 */} {/* 투명 슬라이더 */}원래 의도는 이랬다:회색 바 위에 흰색 바가 진행도를 나타냄hover 시 회색 바의 색이 살짝 밝아지길 원함그런데 문제는,아무리 hover:bg-[#535764]를 줘도 hover가 먹히지 않았다.원인 추적원인은 금방 찾았다.input[type="range"]가 absolute로 맨 위를 덮고 있었던 것이다.즉, hover를 감지해야 하는 div 위를 투명한 input이 막고 있었던 것이다.첫 번째 시도: z-index처음엔 이렇게 생각했다.“그럼 input을 z-index로..