모바일 해상도
https://atelierhandsforpaws.tistory.com/entry/아이폰-모델-별-viewport-sizes-화면사이즈해상도
바닥 버튼이 block일 경우 스크롤 작동X (safari,안드로이드 기본 브라우저,삼성인터넷)- 방법 1 : position:fixed인 요소, 그 부모에 transtorm 추가 ⇒ 스크롤은 작동하나 상단바가 사라짐 https://ibks-platform.tistory.com/367
- 방법 2 : js - EventListener 추가 ⇒ 스크롤 작동 X https://ibks-platform.tistory.com/367
- 방법 3 : body와 html에 height 추가 ⇒ 스크롤 작동 X https://im-designloper.tistory.com/63
- 방법4 : .content_center 상단에 padding 값 주기 ⇒ 스크롤 작동 O, but 처음 화면에서 여백이 너무 많음
- 방법5 : vh단위를 dvh로 변경 ⇒ 오류 해결 https://velog.io/@day_1226/CSS-오류-해결-모바일-브라우저에서-100vh-적용-안됨
- 방법 1 : position:fixed인 요소, 그 부모에 transtorm 추가 ⇒ 스크롤은 작동하나 상단바가 사라짐 https://ibks-platform.tistory.com/367
이미지 출처 : https://blanche-toile.com/web/large-small-and-dynamic-viewport-units
dvh (Dynamic Viewport Height)
dvh는 주소 표시줄이 스크롤을 통해 축소가 되건 노출이 되고 있건 상관 없이
현재 보여지는 뷰포트 높이를 동적으로 가져온다.
위 이미지의 예시 처럼 100dvh는 주소표시줄의 유무에 따라 값이 달라진다.
*