Absolute positioning bug in IE8

Question

Hello, Internet Explorer 7 & 8 (IE7 & IE) are not positioning drop down menu items properly using absolute positioning. FireFox, Chrome, and Safari all render the drop down menu item(s) positions properly. In IE7 & IE8, the the drop down menu items are offset to the right instead of dropping down directly under the parent item.

The site is mysacoupons.com/home

When you hover the mouse over the category menu items, you'll notice the bug in action. Is there a way to fix this? Please help, I am stumped! is the code:

#page-container .page-navigation { width: 920px; margin-left: -10px; z-index: 200; min-height:50px; }

.page-navigation ul {  margin: 0 10px 0 10px; padding-left: 10px; }

.page-navigation ul li { float: left; padding: 10px 0 20px 12px; }

.page-navigation ul li a { display: block; font-weight: bold; font-size: 1.2em; color: #fff; text-decoration: none; text-transform: uppercase; border-right: 1px solid #bbb; padding-right: 13px; }

.page-navigation ul li a:hover { color: #ccc; }

.page-navigation ul li a em { display: block; font: italic 0.8em Georgia, Times; color: #999; text-transform: none; }

.page-navigation ul li.last a { border: none; }

.page-navigation ul ul li a { color:#333; }

/* dropdown */

#nav, #nav ul{ z-index:99; list-style-type:none; list-style-position:outside; position:relative;  } 

#nav ul { display:none; }

#nav a{ display:block; float:none; } 

#nav li{ float:left; position:relative; } 

/* first dropdown */

#nav ul { position:absolute; top:4.4em; z-index:99; margin: 0 0 0 -15px; padding: 15px; background-color: #fff; border-left: 1px dotted #777; border-right: 1px dotted #777; border-bottom: 1px dotted #777; } 

.page-navigation #nav li ul li{ float: left; clear: both; height: auto; padding: 0 0 8px 0; margin: 0 0 8px 0; border-bottom: 1px dotted #ccc; } 

.page-navigation #nav li ul li.last { padding: 0; margin: 0; border: none; } 

/* drop links */

#nav li ul a{ font-size: 1.0em; width:14em; height:auto; z-index:99; border: none; } 

#nav ul ul{ top:auto; z-index:99; } 

/* second level dropdown */

#nav li ul ul { left:14em; margin:-32px 0 0 12px; z-index:99; } 

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{ display:none; z-index:99; } 

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{ display:block; z-index:99; }