iOS7이 설치된 iPhone에서 가로 모드로 전체 높이가 표시되지 않음

iPhone에서 iOS7의 Safari 문서 높이에 문제가 있음을 확인했습니다. 나는 아이 패드에 관한 많은 이야기를 보았지만 아이폰에 대해서는 아무것도 보지 못했다.iOS7이 설치된 iPhone에서 가로 모드로 전체 높이가 표시되지 않음

어떤 이유로 문서의 전체 높이가 표시되지 않습니다. 참조
http://jsbin.com/bohociyo/1

enter image description here

마크 업 + CSS :

는 여기 JSBin 데모의 방향 변화에

<html> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title>iPhone iOS7 bug</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui"> 
</head> 
<body></body> 
</html> 

html, body { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
    width: 100%; 
} 

body { 
    overflow: hidden; 
    background: #fff; 
    color: #000 
} 

body::before { 
    display: block; 
    text-align: center; 
    position: fixed; 
    right: 0; 
    left: 0; 
    top: 0; 
    z-index: 9999; 
    padding: 5px; 
    white-space: pre; /* or pre-wrap */ 
} 

@media only screen and (orientation:portrait) { 
    body::before { 
    content: "Portrait \A Works as intended."; 
    } 
} 

@media only screen and (orientation:landscape) { 
    body::before { 
    content: "Landscape \A Does not display the full height of the document. \A Grey bar appears."; 
    } 
}

출처

2014-06-05 INT

간단한 window.scrollTo(0, 0); 그것을 해결 한 것으로 보인다.
버그를 일으키는 최소한의 UI 태그입니다.

window.addEventListener("orientationchange", function() { 
    window.scrollTo(0, 0); 
}, false);

출처

2014-06-08 23:15:33 INT

iOS7이 설치된 iPhone에서 가로 모드로 전체 높이가 표시되지 않음

답변

관련 문제