html - FireFox 中 iFrame 高度问题的修复方法是什么？

Question

我已经环顾四周并多次浏览了我的代码，但找不到解决我的问题的方法：

FireFox 中的 iFrame：

火狐 iFrame

Chrome 中的 iFrame：

铬 iFrame

HTML：

<iframe width="100%" height="100%" frameBorder="0" id="map" src="link-to-map"></iframe>

CSS：

#map {
    max-width: 900px;
    height: 400px !important;
    padding: 10px;
    margin: 20px auto;
}

我没有尝试解决 FireFox 中的高度问题，还有其他人遇到过这个问题并找到了解决方案吗？

score 2 · Accepted Answer

尝试将 iframe 放置在

height:100%;

在一个 div 中

height: 400px !important;

或者只是制作 iframe

height: 400px;

score 2 · Accepted Answer

我遇到的问题的解决方案是具有<span>属性的类display:none;（用于 jQuery 页面加载），我将其更改为<div>具有属性的类visibility: hidden;，这已经解决了问题。

这似乎只是 FireFox 中的一个问题。我不确定这是否是一个错误，或者可能只是我糟糕的编码。

希望这可以在将来为其他人减轻很多压力。

score 0 · Accepted Answer

<iframe width="880px" height="380px" frameBorder="0" id="map" src="link-to-map"></iframe>

#map {
max-width: 900px;
height: 400px !important;
padding: 10px;
margin: 20px auto;

}

希望这会奏效...

3 回答 3