35 replies

Fixed element not scrollable when resizing mobile screen?Bottom of the screen is eating the element.

So I have this element that is like a confirmation of order that pops when you are done and is fixed positioned. However, when I resize mobile view to smaller screen, vertically, it slowly stats disappearing from the bottom up and is not scrollabe.

Element CSS:

css 
.order-confirmed {
    position: fixed;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    background-color: #fff;
    width: 100vw;
    height: 87vh;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    padding: 2.5rem 1.5rem;
}

css 
.order-confirmed {
    position: fixed;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    background-color: #fff;
    width: 100vw;
    height: 87vh;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    padding: 2.5rem 1.5rem;
}

KP-C

Kevin Powell - Community•16mo ago•

35 replies

Dovah

Fixed element not scrollable when resizing mobile screen?Bottom of the screen is eating the element.

css 
.order-confirmed {
    position: fixed;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    background-color: #fff;
    width: 100vw;
    height: 87vh;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    padding: 2.5rem 1.5rem;
}

css 
.order-confirmed {
    position: fixed;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    background-color: #fff;
    width: 100vw;
    height: 87vh;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    padding: 2.5rem 1.5rem;
}

Fixed element not scrollable when resizing mobile screen?Bottom of the screen is eating the element.

Similar Threads

Fixed element not scrollable when resizing mobile screen?Bottom of the screen is eating the element.

Similar Threads

Similar Threads

Similar Threads