IE9 Header Mobile Menu problem

[Hugo]

Hugo

April 29, 2017 at 8:09 pm

Hi Kadence!

I found an issue on IE9. It’s an old version but people using cheap smartphones and light browsers might use this user agent. Let’s them surviving without a brand new smartphone!

The mobile menu button is broken and appears below the mobile site logo/header. Also the header height and the logo position is wrong. You can reproduce this on the ascend demo 2 website. I’ve emulated IE9 from my IE11 browser and made a quick fix.

I use a small logo together with a site name. The site name is wrapped on 2 lines, left aligned to the logo, that’s why I use a defined width of 130px.

.mobile-header-container .kt-mobile-header-toggle {
position: absolute9;
right: 7px9;
top: 09;
}
.kad-mobile-header-height {
line-height: 60px9;
}
#mobile-logo .kad-mobile-site-title {
display: inline-block9;
width: 130px9;
vertical-align: middle9;
}

Can you propose something better, maybe in the next theme update?

Thanks
Hugo