Drop Down Menu Submenu Alignment Problems

[chrisfromboji]

In firefox my drop down menus work and look fine. But, when I'm testing using IE, the drop down menus appear to start half way over instead of directly below the category they appear below.

Anyone have any ideas?
My website: 12.218.126.198/index2.html
CSS: 12.218.126.198/style.css (this contains the css for the nav and drop down menu)

Thanks!
-Chris
Edit/Delete Message

[chrisfromboji]

just an update - this issue has been resolved on another forum. i'll quote the post in case anyone else has a similar problem here.

The problem is that, due to a bug, IE6/7 will center a block-level element under text-align: center. This also happens for absolutely positioned elements with auto offsets in both IE6 and IE7. In IE7 the situation has got somewhat better so that if you specify explicit offsets then the element is positioned correctly [1].

Because you have set text-align: center for your first-level list items your second level menu is displaced because it is absolutely positioned with auto offsets. Since your anchor elements are block-level and are as wide as their parents you can solve the problem by moving text-align: center to the anchor elements instead. Since the second-level menu is not nested within the first-level anchor elements it will not be affected by the text-align: center set for those.

#nav li {
	display:inline;
	background-color:#245882;
	width:120px;
	height:22px;
	float:left;
	margin-left:4px;
	/* text-align:center; */
}
#nav a {
	width:120px;
	height:19px;
	padding-top:3px;
	text-decoration:none;
	color:#a5cae5;
	font-weight:800;
	display:block;
	text-align:center;
}