직장에서 디자인을 위해 아코디언 UI 를 구현해야하는 상황이었습니다.구현과정에서 알게된 점들을 적어봅니다.1. height 속성에 Transition 효과 적용하기CSS height 속성은 % 와 같은 상대값이 아닌 px 과 같은 절대값을 부여해야 트랜지션 효과가 적용됩니다.문제는 클라이언트의 디바이스, 폰트 등의 요소에 따라서 height 값이 달라질 수 있기때문에 px 값을 미리 정의해두는 것은 불가능합니다.때문에, max-height 값에다가 트랜지션 효과를 부여하는 대안이 있었습니다.// openmax-height: 100vh (혹은 엄청나게 큰 절대 값, 999px)// cloasemax-height: 0그러나 열리는 모션과 닫히는 모션이 동시에 실행되는 경우, 타이밍이 맞지 않는 문제가 있었습..
