element-ui 中dialog居中

简介: element-ui 中dialog居中
.el-dialog{
       display: flex;
       flex-direction: column;
       margin:0 !important;
       position:absolute;
       top:50%;
       left:50%;
       transform:translate(-50%,-50%);
   }
   .el-dialog .el-dialog__body{
       flex:1;
       overflow: auto;
   }


居中的另外一种方式


/* 第三种方式 用了css3的知识 div绝对定位水平垂直居中【Transforms 变形】 IE8不支持*/  
/*绝对定位  left top各50%  最后用css3的知识    transform: translate(-50%, -50%);*/
div {
       width: 200px;
       height: 200px;
       background: green;
       position: absolute;
       left: 50%;
       top: 50%;
       transform: translate(-50%, -50%);
}
相关文章
Element ui dialog弹窗最大化最小化关闭组件封装
封装一个最大化最小化关闭的dialog弹窗组件
3401 1
|
JavaScript 前端开发
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能5
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能5
260 0
element UI【解决方案】消息弹框被对话框遮挡($message消息框被dialog或$alert遮罩)
element UI【解决方案】消息弹框被对话框遮挡($message消息框被dialog或$alert遮罩)
1191 3
|
前端开发
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
1069 0
|
JavaScript
VUE element-ui之table双表头遍历及筛选自动(回车查询)、重置、关闭dialog重置
VUE element-ui之table双表头遍历及筛选自动(回车查询)、重置、关闭dialog重置
1142 10
VUE element-ui之table双表头遍历及筛选自动(回车查询)、重置、关闭dialog重置
|
JavaScript 前端开发
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能4
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能4
173 0
|
JavaScript
解决 Element-ui中 对话框 (Dialog)中含子组件时,使用 refs 调用该子组件为 undefined 的问题
解决 Element-ui中 对话框 (Dialog)中含子组件时,使用 refs 调用该子组件为 undefined 的问题
1456 0
解决 Element-ui中 对话框 (Dialog)中含子组件时,使用 refs 调用该子组件为 undefined 的问题
|
JavaScript 前端开发
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能5
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能5
300 0
|
JavaScript 前端开发
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能3
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能3
239 0
|
JavaScript 前端开发
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能2
前端学习笔记202306学习笔记第五十四天-react.js & material-ui之Dialog表单提交,ICon样式事件,删除功能2
249 0

热门文章

最新文章