Menu won't nest in iOS 8 on ipad

When you click on a menu item to the drop down works perfectly. But, you can’t use your finger on a mobile device and click outside of the dropped menu so it will nest back into the menu. A mouse works perfectly on a desktop computer but it has that one glitch on a mobile device. I’m on an iPad Air with iOS 8. Don’t have an android to try it on to see if it an iOS issue or a coding issue in my end.

Here is the URL:

http://forestviewmultimedia.com/dm2

Here is the css file with the code that is formatting the menu.

http://forestviewmultimedia.com/dm2/menu.css

Thanks for looking.

That’s the problem with CSS dropdowns on mobiles. IMHO, CSS dropdowns are not viable any more, because of this problem with touch screens. My preference now is to have drop menus open by default (i.e. accessible without JS), and then use JS for devices that support it to close the dropdowns and introduce any other functionality that’s needed, like onclick and touch event listeners.