Sidebar width is too large on mobile landscape

[Daltz333]

Ideally it'd be limited to some sort of max-width. I've been experimenting with a local fix at https://daltz-private.rtfd.io/en/fix-css but it seems that the content is adjusted to left: 85% and not sure how to work around this

[Daltz333]

Our CSS ended up looking like

/* Hide color bar on mobile */
@media screen and (max-width: 768px) {
    .header-bar {
        display: none;
    }

    .wy-nav-content-wrap {
        margin-left: 0px;
    }

    .wy-nav-side {
        width: 300px;
    }

    .wy-nav-side.shift {
        max-width: 320px;
    }

    /* Fix sidebar adjust */
    .rst-versions {
        width: 85%;
        max-width: 320px;
    }
}

/* Handle landscape */
@media screen and (min-width: 377px) {
  .wy-nav-content-wrap.shift {
    left: 320px;
  }
}

where the sidenav and version picker was limited to 320px (extra 20px for scrollbar). Version picker was set to scale with the sidebar (85%) up to 320px. And then a special query was added for determining when to set the left: 85% scale by doing 320/.85