CSS drop down?

HTML & CSS
1

I am having trouble finding a good blog post on how to add a css drop down to my nav. I have changed all the classes and id’s to mine but still nothing works. Does anyone know of a really simple one they could point me to?

2

Paul O’B has a number on his site:

His full list can be found on his main page: http://pmob.co.uk/

3

SUPER SIMPLE, 1 level drop :


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<style type="text/css">
					.nav, .nav ul {padding:0; margin:0; list-style: none;}
					.nav li { position:relative;  float:left;}
					.nav a{display:block; padding:.25em; border:2px solid transparent;}
					.nav li:hover { background:#e8e7df ;color:#371f1b ;}
					.nav li:hover a { color:#371f1b ;}
					.nav li:hover> a { color:orange;}
					.nav li ul  {margin-left:-999em ; top:-999em; background:inherit; position:absolute; width:10em;  }
					.nav li li{ float:none; }
					.nav >li:hover>ul {top:100%;  }
					.nav li  a{padding:.33em 1em; }
					.nav >li li:hover>ul {top:0; left:100%  }
					.nav >li:hover>ul,.nav >li:hover>ul {margin-left:0;}
					.nav { background: silver; width: 50%; margin:0 auto; display:table;}
					</style>
	</head>
	<body>
<ul class="nav">
	<li><a href="#">item</a></li>
	<li><a href="#">item</a></li>
	<li><a href="#">item</a>
		<ul>
			<li><a href="#">item</a></li>
			<li><a href="#">item</a></li>
			<li><a href="#">item</a></li>
		</ul>
	</li>
	<li><a href="#">longer sample item</a>
			<ul>
			<li><a href="#">item</a></li>
			<li><a href="#">item</a></li>
			<li><a href="#">item</a></li>
			<li><a href="#">item</a></li>
			<li><a href="#">item</a></li>
		</ul>
	</li>
	<li><a href="#">item</a></li>
</ul>
	</body>
</html>

Remember to make sure you have a proper nested list:
<li><a></a> <ul>…</ul></li>
You really only need ONE class on the root UL

hope that helps