모바일 화면 PC로 시뮬레이션하기 & ios 100vh 오류 수정

CSS로 화면에 딱 맞게 하려고 100vh를 사용했는데, 모바일(IOS)에서 확인해보니 하단바 밑으로 스크롤이 생기는 현상이 생겨버렸다...;; 너무 당황스러워 여러가지 서치해보니 하단바까지 사이즈를 잡아버려서 이런 현상이 일어나는것 같다. 이 현상을 수정할 방법으로 CSS를 수정하는 것으로 해보았다. 방법1 1. 뷰포트를 사용할 엘리먼트에 CSS 추가 (대부분 body나 특정 엘리먼트 선택) .test_elment{ height: 100vh; height: -webkit-fill-available; height: fill-available; } 2. ios용 미디어쿼리 추가 @supports (-webkit-appearance:none) { height: -webkit-fill-available; } ..

2022.09.22