【element-ui】element 怎么设置<el-main>里的iframe大小占满剩余空间？

element 怎么设置<el-main>里的iframe大小占满剩余空间？设置iframe的width，height的百分比，火狐和谷歌的显示还不一样，怎么解决？

<style>
  .el-main {
 background-color: rosybrown;
 color: #333;
 text-align: center;
 line-height: 84vh;
  }
</style>

    <el-main>
                <iframe style="width:100%"  src="http://www.runoob.com">
                </iframe>
            </el-main>

style怎么设置？
捕获.JPG谷歌浏览器显示效果。
捕获1.JPG 火狐浏览器显示效果
如果iframe的width调大了，火狐的范围下的el-main的高度会扩大，有什么解决办法么？

回答：

思路原理是这样：

外层el-main用flex纵向布局，display: flex; flex-direction: column;
里层iframe设置display: block; flex: 1;，充满整个高度

以上是 【element-ui】element 怎么设置&lt;el-main&gt;里的iframe大小占满剩余空间？ 的全部内容， 来源链接： utcz.com/a/151067.html

回到顶部