Question

我在移动游戏中出于某种原因在一个弹出窗口中有一个iframe，一旦iframe加载它就会改变iframe的大小以超出屏幕尺寸，无论我在检查器中做什么，计算出的样式都不会更新。

检查员显示的样式正在生效（并且可以在包括android在内的其他地方使用）：

.gc-lightbox > iframe {
    background-color: #FFF;
    height: 645px;
    width: 900px;
    position: relative;
    border: 4px solid rgba(255, 255, 255, 0.5);
    max-height: 90%;
    max-width: 90%;
    overflow: hidden;
    border: none;
}

然而，在移动游猎中，“计算高度”和“计算宽度”是偏离的（取决于你发起的弹出窗口）它们高达3000px高和700px宽。 Inspector没有height: 900px或max-height: 90%划掉，即使我将style="width: 300px !important; height: 300px !important"直接放在iframe标记上，计算值仍会超过这些值而没有指示原因。

任何线索？

点击任何校园旅游链接（正如我所说，它按预期工作，但移动野生动物园 - 甚至是android） http://www.georgiancollege.ca/new-campus-tours/

Answer 1

在我的一个项目中，Safari计算规则与样式规则不匹配。而且，你甚至直接添加！重要的内联样式没有帮助。

罪魁祸首证明对页面的过渡效果过多。转换是在输入和textareas（我们用JS操纵了很多）。换到这个帮助了我。

  transition: none;

为什么移动safari中的计算风格与统治风格不同？

1 个答案: