위치 사용시 높이 : 고정

Question

데스크톱에서 내 사이트의 팝업을 열면 좋습니다. 그러나 휴대 기기에서 팝업을 열면 팝업 오버레이의 높이가 두 배로 높아집니다 (팝업이 페이지 상단으로 이동).

Example of popup: http://jsfiddle.net/tb28F/ 

어떻게 해결할 수 있습니까?

업데이트. 내 문제의 예 : imgur.com/hKHjPzP

Answer 1

뷰포트 메타 태그를 추가 한 후, 뷰포트의 높이 값으로 높이를 설정하십시오 :

<meta name="viewport" content="width=device-width, initial-scale=1.0" /> 

그리고 CSS : 당신이 원하는

.popup-overlay { 
background: rgba(0,0,0,.5); 
position: fixed; 
left: 0; 
top: 0; 
width: 100%; 
height: 100vh; 
text-align: center; 
overflow: auto; 
}