elementUI el-dialog弹框居中
Posted dyy-dida
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了elementUI el-dialog弹框居中相关的知识,希望对你有一定的参考价值。
添加如下样式,现在这个弹框既能在视窗居中,又能在内容过多时防止弹框大小超出视窗,还能把滚动限制在body内部从而使得头和尾始终可见,再也不用滚上滚下去找各种标题和按钮了!
.el-dialog display: flex; flex-direction: column; margin:0 !important; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); /*height:600px;*/ max-height:calc(100% - 30px); max-width:calc(100% - 30px); .el-dialog .el-dialog__body flex:1; overflow: auto;
以上是关于elementUI el-dialog弹框居中的主要内容,如果未能解决你的问题,请参考以下文章
Vue+ElementUI中 el-dialog弹框蒙层问题
el-dialog 全屏 el-dialog__body高度不够问题