gpt4 book ai didi

css - 如何在 Firefox 中使包含 div 的 iframe 100% 高度?

转载 作者:技术小花猫 更新时间:2023-10-29 11:02:51 26 4
gpt4 key购买 nike

我在弄清楚如何在 Firefox 和 IE 中将 iframe 扩展到它的容器元素的 100% 时遇到了一些麻烦(在 Chrome 中工作正常)。通过四处搜索,必须在包含的 div 上指定一个高度(可能还有 body 和 html)是有道理的。但是,我已经这样做了,iframe 仍然没有扩展。是否所有父 div 都必须具有指定的高度和位置才能工作,或者只有包含父 div?对此的任何修复将不胜感激!

这是我所拥有的:

<!DOCTYPE html>
<html>
<head>
<style>
html, body {margin:0; padding:0; height:100%}
#container {width: 1000px; min-height: 550px; position: relative}
#smallContainer {position:relative} /*no height specified*/
#iframeContainer {height: 100%; position: relative}
#iframe {height: 100%; width: 100%; display: block}

</style>
</head>
<body>
<div id="container">
<div id="smallContainer">
<div id="iframeContainer">
<iframe id="iframe" src="foo.com"></iframe>
</div>
</div>
</div>

</body>
</html>

最佳答案

你可能需要……的组合

$(function(){
var height = window.innerHeight;
$('iframe').css('height', height);
});

//And if the outer div has no set specific height set..
$(window).resize(function(){
var height = window.innerHeight;
$('iframe').css('height', height);
});

关于css - 如何在 Firefox 中使包含 div 的 iframe 100% 高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9816703/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com