A CodePen by John Gardner. CSS3 Dropdown Menu - Pretty much exactly what the title says. Features cursor proximity detection, fluid widths, potentially unlimited levels of subnavs, and CSS3 transitions, all without JavaScript (JS *is* used to smooth over some things for older browsers).

Source files also hosted on [GitHub](https://github.com/Alhadis/CSS3-Dropdown-Menu).

**History:**  
The first build of this project was completed in May 2010; it started as a sort of self-appointed dare to see if it were possible to create a CSS-only dropdown menu with fluid widths and cursor detection (supplanting the need for "proximity testing" scripts - e.g., Suckerfish). After much caffeine and elbowgrease, I actually did it.

The subsequent transition-supporting build was completed somewhere in September 2011; it uses a polyfill (powered by jQuery) to add transitions for browsers that don't support them in CSS.

**Support:**  
Neither of these menus are tested or supported in IE6, and quite frankly, I couldn't give a damn, either. Move on, people.

Slightly bulky and awkward in IE7, but fine on IE8+.

Naturally functions as smooth-as-silk on Firefox, Chromium, Opera, Safari, etc.


**WordPress Developers:**  
If you wish to use this code for navigation menus, there's a [walker subclass](https://raw.github.com/Alhadis/CSS3-Dropdown-Menu/master/Dropdown%20with%20Transitions/walker.php) available. Just drop the code into your theme's `functions.php` file and be sure to pass a new instance of the `Padded_Walker` class to `wp_nav_menu()` (using the "walker" argument). [More on that here](http://codex.wordpress.org/Function_Reference/wp_nav_menu#Using_a_Custom_Walker_Function).