[Support request] Strange issue with viewport, the view on mobile devices

Hi there,

the Drop Box in the sidebar – there are some buttons, and i see this CSS being applied to them:

@media only screen and (max-width: 600px) {
    .dropdown {
        width: 110%;
        display: block;
        margin-bottom: 20px;
    }
}
@media only screen and (min-width: 600px) {
    .dropdown {
        width: 113%;
        display: block;
        margin-bottom: 20px;
    }
}

I cannot see where that CSS is coming from because the CSS has been optimized and cached.
The problem is the width: 110%; value ons small screens and width: 113%; on larger screens – both are wider then the screen.

Not sure if you have access to the CSS but it needs editing.

If you don’t have access then add this CSS to fix the issue its creating:

.doc-box .dropdown {
    max-width: calc(100vw - 40px);
}
.doc-box .dropdown .dropbtn {
    width: 100%;
}