안녕하세요 웹 프론트엔드 개발자 설탕시럽입니다. CSS에서 요소의 Z축을 설정할 수 있는 두가지 방법이 있습니다. z-index와 transform의 속성인 translateZ가 그 대상인데, translateZ는 z-index에 비해 많이 사용되지 않을 뿐 아니라, 적용도 잘 안되는 경우가 많은데 이 부분에 대해서 얘기해보려고 합니다. z-index 위치 지정 요소와 그 자손 또는 하위 플렉스 아이템의 z축 순서를 지정합니다. z-index 값이 더 클수록 작은 값의 요소 위를 덮는 개념입니다. auto 키워드 또는 음수와 양수 값을 통해 요소의 우선순위를 지정할 수 있습니다. 카르테시안 좌표계 css의 transform 속성 translate에 대해 우선 살펴보면서 Z축이 무엇인지 살펴봅니다. tra..

Chrome 에서는 input:range의 background 색상 변경이 불가능 하다. 그래서 각종 사이트들을 돌아다니며 참조해보니 div를 이용해서 자체적으로 range를 생성하기도 하던데, 고민하던중 적당한 해답을 찾았다. (거의 2일동안.... 고민했는데..)