ios iframe scroll 높이값이 적용되지 않는 문제

약관동의 페이지를 iframe으로 작업 하였는데,

ipad에서 확인을 하니 아래와 같이 전문이 노출되는 이슈가 있다는 것을 발견 하였습니다.

ipad에서 본 화면

수정 후 ipad에서 본 화면

기존 iframe단독으로 스크롤 시켰던 부분을 div로 하나 감싼 후, CSS로 스타일링 한다.

[HTML]

<div class="iframeDiv nate_agree">

     <iframe src="sample2.html" frameborder="0" title="SK플래닛 OneID서비스이용약관"></iframe>

</div>

[CSS]

.agree_iframe .iframeDiv {width:698px; height:80px; margin-bottom:-1px; border:1px solid #d9d9d9;  overflow:scroll; overflow-x:hidden; -webkit-overflow-scrolling: touch; }

iframe {overflow:hidden; display:inline-block; width:100%; height:2000px; border:0; background:transparent;}

문제점 

- iframe의 높이값을 알 수없을때 스크롤 맨 하단에 빈 여백이 생김.