Menu-Bugs

Hi

I’m using Twenty Sixteen as the base for customized theme. I love it, great work!

Anyway, I did two style-fixes to problems, that may also occur in the original theme – sorry, did not check, but both problems are in menu placing with which I did not mess.

The first occurs only on really big screens where the menu moves far right, partially off-screen. My (for twentysixteen probably insufficient but for me good enough) fix:

@media screen and (min-width: 44.375em),
@media screen and (min-width: 56.875em) {
       .site-header-menu {
                flex-basis: 50%;
        }
}

The other one occurs only in a small resolution range between phone and desktop (discovered it on a vertical tablet). The menu is displaced and the background text shows through. My fix is rather a hack and I’d love to remove it in favor of a fix from someone who knows (twentysixteen) what (s)he’s doing:

@media screen and (max-width: 56.875em) {
        #site-header-menu.toggled-on {
                position: absolute;
                top: 4.8em;
                right: 3.7em;
                width: 10em;
                z-index: 1;
                background-color: white;
                padding:1em;
        }
}

Thanks for providing this great theme. Customizing it is a pleasure.