A CodePen by Francisco Campos. css3 animated, responsive navigation menu (with submenu) for unknown number of menu items. - The ridiculously long name says it all really...

The code (particularly the css) could do with cleaning up in a few places but basically this is a responsive navigation menu technique that doesn't rely on falling back to selects at mobile sizes and instead gives (in my opinion) a much better looking menu for mobile using css3 transitions. 

The menu is designed to handle an unknown number of menu items using only css - for example in WordPress sites, where heights for animations will always be unknown.

Menus/submenus are shown and hidden with css, javascript is only used to add a couple of classes on click. This could conceivably work using pure css and :target if you're particularly keen to avoid javascript altogether!

Works great in all real browsers and gracefully degrades without js and on Microsoft® software.

menu icon from symbolset icon font. visually hidden technique bastardised from html5 boilerplate