⛳️ 목표

• 메뉴 목록에 커서를 옮길 때 마다 밑줄이 길이가 변하며 따라오는 기능

🛩 진행정도

• commit 1 (2022/02/12) : html과 css 뼈대까지 완료
• commit 2 (2022/02/13) : 마우스 올려놓으면 해당 항목에 밑줄 가는 작업 진행중

🤔 문제와 해결과정

• 가로형 네비게이터와 세로형 네비게이터를 먼저 구현해야 했는데 html, css 부터 힘들었음

  유튜브의 드림코딩by엘리 강의영상과 poiemaweb 웹문서를 읽으며 다시 공부해서 어느정도 보완후 만듬

• 창을 다른 비율의 모니터로 옮기니 슬라이딩 인덱스가 위치가 안맞는 문제가 발생

  처음엔 absolute로 설정했었는데 비율에 따라 절대위치가 조금씩 바뀌어서 생기는 문제같았음. relative로 설정하니 모니터를 옮겨도 의도한대로 출력됨.

• 슬라이딩 인덱스를 메뉴 요소들과 같은 부모 밑에 두니 flexbox의 center를 이용했을때 정확히 center에 오질 않음

  끝에 빈 div 태그를 하나씩 더 달아줘서 가운데 오게 만듬. 세로 정렬은 그냥 빈 div태그로 됐는데, 가로정렬은 div태그만 놓으면 안되고 nav와 동일한 class를 주니 됨

• 마우스를 갖다 댈때 해당 항목 밑에 밑줄이 생기는 걸 구현하는데 세로줄은 괜찮은데 가로줄은 항목에 마우스를 가져갈때마다 요소들 위치가 조금씩 바뀜