CSS Menu
HTML
<!-- Nested Unordered Lists Form Menu Elements
A Variation of code from http://line25.com/tutorials/how-to-create-a-pure-css-dropdown-menu --->
<nav>
<ul>
<li><a href="http://cis3630.org/cissyllabus-spring-2015.html">Lecture Notes</a>
<ul>
<li><a href="http://cis3630.org/jsfiddle.html">jsFiddle</a>
<ul>
<li><a href="http://jsfiddle.net/aalbc/vwajmt67/">Navigation Menu</a></li>
<li><a href="#">Centering Div Test</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
CSS
nav ul ul {display: none;}
nav ul li:hover > ul {display: block;}
nav ul {background: linear-gradient(135deg, red, blue);
box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
padding: 0 20px;
border-radius: 10px;
list-style: none;
position: relative;
display: inline-table;}
/* nav ul:after {content: ""; clear: both; display: block;} */
/* nav ul li:hover {background: #4b545f;
background: linear-gradient(top, #4f5964 0%, #5f6975 40%);} */
/* nav ul li {float: left;} */
/* nav ul li:hover {background: linear-gradient(top, #bbeeff 0%, #0055bb 40%);} */
/* nav ul li:hover a {color: #fff;} */
nav ul li a {display: block; padding: 25px 40px;color: #fff; text-decoration: none;}
nav ul ul {background: #5f6975; border-radius: 0px; padding: 0; position: absolute; top: 100%;}
nav ul ul li {float: none; border-top: 1px solid #6b727c; border-bottom: 1px solid #575f6a; position: relative; }
nav ul ul li a {padding: 15px 40px; color: #000;}
/* nav ul ul li a:hover {background: #4b545f;} */
nav ul ul ul {/* position: absolute; */ left: 100%; top:0;}