将iframe装入div [英] Fitting iframe inside a div

问题描述

我想在一个div中安装一个iframe。我的问题是，我似乎不能让它嵌套到div的宽度的100％，我需要指定iframe的像素宽度。

I am trying to fit an iframe inside a div. My problem is that I can't seem to get it to nest to 100% of the width of the div, I need to specify pixel width of the iframe.

我希望iframe是内部的div，所以如果div由一个较小的浏览器调整大小，iframe也调整大小。

I would like the iframe to be "inside" the div so that if the div is resized by a smaller browser, the iframe gets resized too.

这是我的代码： / p>

This is my code:

<div class="row-fluid">
    <div class="span9" id="standard">
        <div class="header-box">
        <p class="header" >Bla Bla Header</p>
        </div>
        <div id="wrap">
    <iframe id="frame" src="https://docs.google.com/a/...."frameborder="0"></iframe>
        </div>
        </div>
(more things in the row)
</div>

和CSS：

#wrap { width: 1130px; height: 100%; padding: 0; 
        overflow: hidden; position:relative;}
#frame { width: 100%; height: 100%; 
        border: 1px solid black; position:relative; }
#frame {
zoom: 0.75;
-moz-transform: scale(0.75);
-moz-transform-origin: 0 0;
-o-transform: scale(0.75);
-o-transform-origin: 0 0;
-webkit-transform: scale(0.75);
-webkit-transform-origin: 0 0;

}

浏览器已调整大小。

Below is what happenswhen the browser is resized.

推荐答案

这个CSS是否会修复它？

Would this CSS fix it?

iframe {
    display:block;
    width:100%;
}

从此示例：http://jsfiddle.net/HNyJS/2/show/

这篇关于将iframe装入div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！