iframe неправильно определяет размеры в Chrome

Question

У меня есть элемент iframe, размер которого правильно установлен в Safari 5.1.5, но не в 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 элемент выглядит так, как ожидается:

Если я изменяю размер браузера, iframe изменяется.

В Chrome элемент выглядит значительно укороченным по сравнению с результатом Safari:

Кроме того, изменение размера окна браузера не меняет размер элемента iframe.

Что-то мне не хватает в моей настройке iframe, которая не нравится Chrome? Спасибо за ваш совет.

Answer 1

Я думаю, что нашел решение здесь, у меня была одинаковая проблема как в Chrome, так и в Firefox на Mac.

Я поместил свой iframe в DIV и добавил параметры "display: block;"а также "position: absolute" как для тега div, так и для тегов iframe.Я думаю, что те двое, где виновники.(Также добавлен дополнительный веб-набор FS для iPad)

работает как шарм!