모바일/크롬에서 첫 접속시 100vh 관련 문제

모바일/크롬에서 첫 접속시 100vh 관련 문제

QA

모바일/크롬에서 첫 접속시 100vh 관련 문제

본문

.main-intro {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 999;

  background: #fff;

  opacity: 1;

}

 

.main-intro > div {

  width: 100%;

  text-align: center;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%,-50%);

  -webkit-transform: translate(-50%,-50%);

}

 

css가 이런식이라고 할 때 .main-intro > div는 정가운데 있어야합니다.

 

다만 크롬의경우 살짝 아래쪽에 위치하다가 클릭 혹은 스크롤하면 다시 가운데로 돌아옵니다..

 

인트로 제작중인데.. 크롬에서만 저러니 방법이없네요 ㅠ

 

 흔히 스크립트로 제어하는 방법 > height: calc(var(--vh, 1vh) * 100);이것도 안먹히고있는 상황입니다.

해결하셨던분 도움 부탁드려요 ㅠ

이 질문에 댓글 쓰기 :

답변 1

인트로라면 fixed 로 하세요.

크롬 뿐만 아니라 비슷한 디바이스의 경우 모바일에서

아래로 스와이프 할경우 주소창이 작아지고 또 위로 스와이프 할경우 주소창이 생깁니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 21
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT