StackedRouter: fix content height is 0 on webkit
* for WebKit, fix the content height is 0 if the window width > 560px
This commit is contained in:
parent
9e9a831785
commit
a69a5c31e5
1 changed files with 11 additions and 2 deletions
|
@ -15,6 +15,16 @@ dialog.StackedPage {
|
||||||
width: 560px;
|
width: 560px;
|
||||||
max-height: 100vh;
|
max-height: 100vh;
|
||||||
max-height: 100dvh;
|
max-height: 100dvh;
|
||||||
|
/*
|
||||||
|
* WebKit does not see contain-instric-size as the real element size.
|
||||||
|
* If the container does not have height, the child element using 100%
|
||||||
|
* height (usually Scafflod in our case) was have 0px computed height.
|
||||||
|
*
|
||||||
|
* This behaviour is different from Firefox. So we need to actually
|
||||||
|
* define the box height here. (Rubicon)
|
||||||
|
*/
|
||||||
|
height: 100vh;
|
||||||
|
height: 100dvh;
|
||||||
background: none;
|
background: none;
|
||||||
display: none;
|
display: none;
|
||||||
|
|
||||||
|
@ -31,10 +41,9 @@ dialog.StackedPage {
|
||||||
|
|
||||||
@media (max-width: 560px) {
|
@media (max-width: 560px) {
|
||||||
& {
|
& {
|
||||||
|
margin: 0;
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
width: 100dvw;
|
width: 100dvw;
|
||||||
height: 100vh;
|
|
||||||
height: 100dvh;
|
|
||||||
contain-intrinsic-size: 100vw 100vh;
|
contain-intrinsic-size: 100vw 100vh;
|
||||||
contain-intrinsic-size: 100dvw 100dvh;
|
contain-intrinsic-size: 100dvw 100dvh;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue