如何使 Google Picker iFrame 响应式？答案

【问题标题】：How to make Google Picker iFrame responsive?如何使 Google Picker iFrame 响应式？
【发布时间】：2015-06-26 11:10:07
【问题描述】：

点击此链接：

一个google picker的demo，可以看到这里的picker iframe的最小尺寸是566 * 350，即使浏览器调整到更小的尺寸也是如此。

我希望这个 iframe 始终与正在调整大小的浏览器成比例，即响应式。

谁能帮我解决我需要在哪里进行哪些更改才能做到这一点？抱歉，我对 CSS 不太了解...

【问题讨论】：

到目前为止你尝试了什么，你能发布你的任何 css 吗？
我什么都不怕，因为我不知道 CSS。我想选择这个东西并在 Python 应用程序中使用它......我唯一的发现是它调整到的最小尺寸，如上所述，我猜在某个地方，一些 CSS 会改变它。任何帮助将不胜感激...所有的 CSS 都可以在链接中找到...
通过查看示例，您可以看出以下带有 CSS 类 picker modal-dialog-content picker-dialog-content 的 div 是您需要相应更改 width 和 height 的div，但样式是动态应用。所以只有 CSS 是不行的。 PickerBuilder 对象有一个方法 setSize。尝试使用此方法先更改大小。否则，您将不得不自己使用 javascript 覆盖动态应用的样式。
这很有帮助。我对此表示感谢。 PickerBuilder 对象及其 SetSize 方法在我的情况下是正确的解决方案，我有一个固定大小的窗口，它小于上面提到的最小大小，Picker 默认为。出于好奇和需要进一步了解的信息，我会要求您分享“宽度”和“高度”的值，我需要在这种情况下应用，直接在浏览器中进行测试，或者像您分享的那样，动态使用“javascript”，使其完全响应，即使我的窗口可以调整大小......
请在此处查看我的回答stackoverflow.com/a/33943812/4801755，了解如何使用 css 解决此问题。

【解决方案1】：

我通过将这些全局样式添加到页面来解决这个问题，这使得选择器在整个页面上展开并在页面动态收缩时收缩

.picker {
  height: 100% !important;
  width: 100% !important;
  top: 0 !important;
}

【讨论】：