Mobile menu icon displays below the navbar when resizing the window on chrome

[buren]

I'm seeing a rather funny bug on Chrome, OSX 10.10 & Windows 7, which causes the mobile menubar to be displayed under the navbar, see the screenshot, it only happens when resizing the window and you can "fix" it be unsetting and setting float:right to ul#menumobile..

It renders fine if the page is small enough for the mobile nav to be shown from the getgo.

[saivann]

@buren I also noticed this little bug in the past! Did you test if the suggested fix has no side effect on mobiles. Thanks for your recent help with the website :)

[buren]

It works fine across all phones, since the mobile menu is render from the start, the problem seems to occur, on chrome, when the browser is resized between the horizontal nav and the mobile nav.

[buren]

It will probably effect iPads running chrome switching between landscape and portrait.

[saivann]

@buren I'm all for fixing it (please feel free to open another pull request). My question was more about the suggested fix (unsetting and setting float:right to ul#menumobile), it might be good to make sure it does not have unintended effect on the layout (maybe also the right-to-left layout used for the Arabic language might be worth testing).

[buren]

Ah, sorry I was a bit unclear I'm not for fixing this using JS it feels way to hacky inorder to fix a corner case which is only a problem in chrome and when resizing the window plus it doesn't brake the functionality.

I'll poke around and see if there are any simpler solutions which only require a minimal change to the CSS.