100vh1 ios chrome 100vh 오류 ios 크롬에서 100vh를 사용하면, 디바이스 높이보다 더 큰 화면이 잡혀 원치 않는 스크롤이 생기는 경우가 발생한다. 스크립트와 css를 섞어서 활용하면 디바이스 크기에 딱 맞는 높이를 지정할 수 있다. let vh = window.innerHeight * 0.01; document.documentElement.style.setProperty('--vh', `${vh}px`); - script에서 현재 디바이스 높이를 기준으로 계산해서 --vh 라는 css 변수를 생성해준다. min-height: calc(var(--vh, 1vh) * 100); - css에서 필요에 따라 min-height 또는 height를 위 코드처럼 설정해주면 디바이스별, 브라우저별 높이를 따로 css에서 신경쓰지 않아도 된다! 2021. 11. 3. 이전 1 다음