mobile 100vh
-
02. 모바일 100vh 스크롤 문제 해결하기Projects/우주 심리 테스트 2021. 6. 9. 20:10
문제발견 모바일 화면에서 전체화면을 만들기 위해 100vw, 100vh로 설정을 했다. 브라우저에서 확인 하면 이상이 없지만, 실제 모바일 브라우저에서는 스크롤이 생기는 현상이 발견되었다...! vw와 vh 우리는 종종 스크린 사이즈의 너비를 혹은 높이 이용해 css 스타일링을 하곤 한다. 이 때 사용하는 단위가 바로 vw, vh 인데 1vw는 스크린 너비의 1%, 1vh는 스크린 높이의 1%를 말한다. 다시 말해, 100vw는 스크린 가로 사이즈, 100vh는 스크린 세로 사이즈를 의미한다. 이번 mbti 페이지에는 이 vw, vh라는 단위를 자주 사용했다. 브라우저의 관리자 모드에서 모바일 환경에서의 해상도를 미리 확인 해 볼수 있는데, 처음에 우리는 이 모드로 계속해서 확인 하면서 화면에 딱 맞는 ..