꾸까 | Day 9

GEUNNN Lee·2021년 3월 28일
0

merge된 부분을 pull 받아 실행 했는데 문제가 생겼다.

응???
내가 알던 footer가 아닌데??? 🤯

전 날 작업한 footer는 검은색 배경에 흰 글자만 있었는데 어째서 인지 노란색 박스가 나오더라.

그래서 우선 개발자 도구를 켜보았다. 어떤 속성이 문제인지 알았는데 어디서 문제인지를 파악하지 못했다.

nav 파일 scss를 보다가 같은 색깔을 확인해 지워봤는데 바뀌지 않았다.

어떤 속성이 문제인지는 알았는데 어디서 해당 속성을 찾아야하는지 모르겠더라. 그래서 장현님에게 sos를 청했다. 어떤 속성 문제인지 알았는데 어디에서 찾아야할지 모르겠다고 개발자 도구를 켜서 도움을 청했다.

upperBox class가 있고 오른쪽에 해당 파일이 나온다. 이 부분을 해당 속성 옆에 파일 이름이 있는걸 모르고 지나쳤다. 개발자 도구랑 친해져야 하는데 기본적인걸 아직도 숙지하지 못한 것 같아 반성했다.

해당 파일을 가서 class 명을 수정했더니,


짠!

깨지지 않고 제대로 나왔다.

사용한 class명이 같아 css가 깨지는 것이었다. 해당 부분을 바꾸니 제대로 나왔다.

앞으로 class명은 조금 더 범위가 좁게 잡아야겠다.
class명이 어떤 페이지에서도 쓰일 수 있는 upperbox, lowerbox로 작성하다 보니 여러 페이지에서 같은 class 이름을 썼고 중복이 되어 css가 깨지는 현상이 발생 했던 것이다.

profile
Frontend Developer 👩🏻‍💻👩‍💻

0개의 댓글