Question

这似乎是一个常见问题，但我无法找到答案。

我试图让Facebook帖子嵌入100％宽度的父母div。所有解决方案似乎都与Facebook评论有关，而不是后嵌入功能。

我尝试将data-width="100%"和width: 100%添加到iframe，但到目前为止还没有任何工作。

感谢您的帮助。

Answer 1

这对我有用：

iframe {
    position:fixed; 
    top:0px; 
    left:0px; 
    bottom:0px; 
    right:0px; 
    width:100%; 
    height:100%; 
    border:none; 
    margin:0; 
    padding:0; 
    overflow:hidden;
}

Answer 2

使iframe的父容器设置为特定宽度：如果它相对于其他父级的宽度，则为100％..否则为页面的整个宽度（视口）设置100vw，或者给它父级px中的某个特定宽度，或者您正在使用的任何宽度。。只有这样iframe才能获得其父级宽度的100％。

.parent {
  margin: 0 auto;
  width: 500px;
  height: 900px;
  background: black;
}

iframe {
  width: 100%;
  height: 100%;
}

<div class="parent">
  <iframe src="http://www.w3schools.com"></iframe>
</div>

Facebook帖子在桌面上嵌入了100％的宽度

2 个答案: