包含带溢出的iframe：隐藏（在Safari中）

Question

我正在使用第三方iframe来提供某些内容，并且我将此iframe包含在包含border-radius和overflow: hidden的div中。但是，iframe的内容似乎忽略了这两者。

.iframe-container {
  border: 8px solid red;
  border-radius: 40px;
  overflow: hidden;
}

<div class="iframe-container">
  <iframe... />
</div>

有人有任何建议吗？

UPDATE 这个问题似乎仅限于Safari。

Answer 1

我没有看到图片和iframe的任何HTML代码，因此我认为您需要为图片添加一个类，然后将border-radius: 40px;添加到该图像类。 他们将完美匹配。

我希望这会对你有所帮助。

Answer 2

从父 div 中删除 border-radius 和 overflow

然后将 border-radius 属性添加到 iframe 中