iframe의 크기가 Chrome에서 제대로 설정되지 않았습니다.

Chrome에서는 아니지만 Safari 5.1.5에서 올바르게 크기가 조절되는 iframe 요소가 있습니다.iframe의 크기가 Chrome에서 제대로 설정되지 않았습니다.

이 요소의 CSS는

입니다 :

iframe { 
    overflow: hidden; 
    width: 100%; 
    height: 80%; 
    border: 1px solid #DEDEDE; 
    background: #fff; 
    margin-top: 10px; 
    margin-bottom: 10px; 
}

HTML은 다음과 같습니다

이

<iframe marginwidth="0" marginheight="0" scrolling="no" src="foo" height="80%" width="100%"></iframe>

사파리에서 요소가 예상 보이는이 같은 :

Safari snapshot

브라우저의 크기를 조정하면 iframe의 크기가 조정됩니다. 크롬에서

는 요소가 많은 사파리 결과에 비해 짧아 보이는 :

enter image description here

또한, 브라우저 창 크기를 조정하면 iframe 요소의 크기를 변경하지 않습니다.

iframe 설정에 Chrome이 싫어하는 것이 있습니까? 조언 해 주셔서 감사합니다.

출처

2012-03-30 Alex Reynolds

iFrame의 상위 요소에 지정된 높이가 있습니까? – Kyle

아마도 iframe과 css에서 크기를 지정하기 때문에 크롬이 80 %의 80 %를 차지할 수도 있습니다. – Rvervuurt

html5 doctype을 사용하는 경우 marginheight, marginwidth 및 scrolling을 제거하면 html5에서 지원되지 않습니다. http://www.w3schools.com/html5/tag_iframe.asp –

-1

여기 해결책을 찾은 것 같아요. Mac의 Chrome과 Firefox에서 같은 문제가있었습니다.

DIV 안에 iframe을 래핑하고 "display : block;"매개 변수를 추가했습니다. 또한 div와 iframe 태그 모두에 "position : absolute"를 지정합니다. 나는 그 두 가지가 범인이라고 생각한다. (iPad 용 webkit FS도 추가되었습니다.)

은 매력처럼 작동합니다!

출처

2013-08-14 16:37:31 sov

iframe의 크기가 Chrome에서 제대로 설정되지 않았습니다.

답변

관련 문제