1

我正在尝试将 iframe 放入网页中，但无论我尝试在 iframe 属性或网站构建器的自定义 CSS 部分中放入什么（或者我尝试将 !important 添加到从宽度到右边距），我无法让 iframe 向右延伸超过页面的预设宽度。

这是我正在使用的页面和 iframe 的示例：（编辑：不再可用）

我需要该脚本/iframe 足够宽以显示搜索区域。复制和粘贴我尝试设置的代码和属性似乎毫无意义，因为我所做的任何事情似乎都没有任何效果，但只是为了显示我不知道我在做什么，这是我的 iframe 代码：

<iframe id="idxFrame"  style="padding:0; margin:0; padding-top: 0px; overflow-x:auto;
width:1000px!important; border:0px solid transparent; background-color:transparent;
max-width:none!important; right-margin:-200px!important" frameborder="0" 
scrolling="on" src="http://www.themls.com/IDXNET/Default.aspx?wid=8MSsp7Pf9eI55yjkDuB%2blX5awn7LnnVXh5PNYhq2ImAEQL" 
width="1200px" height="900px">
</iframe>

我被迫用来制作这类页面的“网站构建器”令人恼火，但它确实有一个“自定义 CSS”区域，我可以在其中输入额外的 CSS 信息。有什么我可以用来将 iframe 设置为自己的宽度的东西吗？

4

3 回答 3

1

它被切断的原因是页面结构中有一些父容器具有overflow: hidden;确保太宽的内容不会破坏布局的属性。

我不知道您的系统是如何工作的，但您可以尝试将以下代码添加到您的自定义 CSS 区域：

.LayoutContainer {
    overflow: visible !important;
}

.LayoutContainer div div {
    overflow: visible !important;
}

请注意，它会弄乱您的布局并在较小的屏幕上产生水平滚动条。

更新：

上述 CSS 会影响您的整个网站。如果你真的想通过它，使用下面的 CSS 来确保只有这个页面受到影响。系统为每个页面生成一个唯一的 ID 号，我们正在利用它。

body#page_33219e82-0110-40bb-a172-3d05dc78f406 .LayoutContainer {
    overflow: visible !important;
}

body#page_33219e82-0110-40bb-a172-3d05dc78f406 .LayoutContainer div div {
    overflow: visible !important;
}
于 2013-10-29T21:45:48.103 回答
0

我相信你的问题是你right-margin在应该使用的时候使用margin-right

于 2013-10-29T21:44:45.327 回答
0

这是我为使其工作而进行的修改，这是一个屏幕截图：http ://screencast.com/t/R2VeIAnNJVd

.LayoutContainer { overflow: visible; }
.LayoutContainer div div { overflow: visible !important; }

如上所述，如屏幕截图所示，您可以看到 iframe 超出了您的内容包装器。

于 2013-10-29T22:57:55.797 回答