|
@@ -4,19 +4,28 @@
|
|
|
html, body, #app {
|
|
html, body, #app {
|
|
|
height: 100%;
|
|
height: 100%;
|
|
|
min-height: 100%;
|
|
min-height: 100%;
|
|
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-// 主体容器撑满高度
|
|
|
|
|
|
|
+// 主体容器只用 flex: 1 填充,不要再设置 min-height: 100%
|
|
|
.layout-body, .main-container, .app-main, .p-2 {
|
|
.layout-body, .main-container, .app-main, .p-2 {
|
|
|
flex: 1 1 0;
|
|
flex: 1 1 0;
|
|
|
- min-height: 0;
|
|
|
|
|
|
|
+ min-height: 0 !important;
|
|
|
|
|
+ height: auto !important;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
|
|
|
+ overflow: auto;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+// 只让 #app 或 .app-wrapper 撑满视口
|
|
|
|
|
+#app, .app-wrapper {
|
|
|
|
|
+ min-height: 100vh;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// .main-container 不再设置 height/min-height
|
|
|
.main-container {
|
|
.main-container {
|
|
|
- height: 100%;
|
|
|
|
|
- min-height: 100%;
|
|
|
|
|
display: flex;
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
|
}
|
|
}
|
|
@@ -34,7 +43,7 @@ html, body, #app {
|
|
|
.el-card.is-never-shadow {
|
|
.el-card.is-never-shadow {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
|
- height: 100%;
|
|
|
|
|
|
|
+ height: 90%;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.el-card.is-never-shadow .el-card__body {
|
|
.el-card.is-never-shadow .el-card__body {
|