如何使iframe对移动设备响应

Question

我试图将iframe对象嵌入我的WordPress网站的页面上。但是，我能够嵌入iframe，但是，该对象在移动设备上从屏幕上运行。这是我被嵌入的iframe

<div style="display:block;margin:0;padding:0;border:0;outline:0;font-size:10px!important;color:#AAA!important;vertical-align:baseline;background:transparent;width:1000px;">
  <iframe frameborder="0" height="1000" scrolling="no" src="https://secure.rightsignature.com/templates/7304f97a-bbbb-4dc7-b48d-6d6a5ac41b5c/template-signer-link/267cd399a88df2a2616ab109b61f7bb5" width="1000"></iframe>
</div>

我尝试用DIV类包装上面的整个代码：

div class="right-signature"

然后使用我在另一个论坛文章中发现的以下CSS：

.right-signature {
    position: relative;
    padding-bottom: 50%;
    height: 0;
    overflow: hidden;
}
.right-signature iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

，但我无法成功地工作。有人知道我该怎么做才能为移动设备工作吗？

Answer 1

我弄清楚了...我最终不必添加任何自定义CSS才能解决问题。我只需要将iframe宽度从1000px更改为100％。