修复在部分设备上布局不正确的问题,优化布局效果
Build and Publish / Run (push) Successful in 1m22s Details

This commit is contained in:
Hmtsai 2024-08-10 09:27:05 +08:00
parent cbc7994230
commit 8c9a13d3f5
2 changed files with 9 additions and 3 deletions

View File

@ -28,6 +28,12 @@
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
@media screen and (max-width:640px){
#app {
margin:0;
}
}
</style> </style>
<div id="app"></div> <div id="app"></div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>

View File

@ -87,18 +87,18 @@ mdui-layout-main {
mdui-card { mdui-card {
margin: 3px; margin: 3px;
width: 24.5%; width: calc(25% - 6px);
height: 25%; height: 25%;
} }
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
mdui-card { mdui-card {
margin: 0; width: calc(100% - 6px);
width: 100%;
} }
mdui-layout-main{ mdui-layout-main{
flex-direction: column; flex-direction: column;
flex-wrap: nowrap;
} }
} }
</style> </style>