CSS 이슈

정말 단순했지만 황당했던 사건.

특정 페이지에서 scops style을 적용했는데 해당 페이지를 거치면 모든 페이지가 깨져서 레이아웃이 망가졌던 현상

평소 open ai를 자주 사용했었는데 css 관련 이슈를 물어봤고

.container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* 화면 전체 높이에 대한 100% */
  }

요런 container 흔한 이름의 className을 내려줬다.

그래서 그대로 붙여넣었더니.. 모든 화면이 깨졌었다.

결론 : 흔한 이름을 쓰지말자. 공통 css에 저런 이름은 흔하기때문에 다른 화면까지 영향을 받는다는 내용.