I thought I had found the code needed to fix IE, but I've either used it incorrectly, or it's just not the right bit of code.
Here's a page with the navbar live:
http://www.skullcrow.com/community_upload.php
Here's the css being used:
CODE
/* horizontal drop down navbar - basic formatting */
#centering_wrap {width:100%; position:relative;}
#menu {margin:0 auto;width: 955px;font: bold 11px/16px arial, helvetica, sans-serif;color:#666;} /* Main width and default font properties */
#menu ul {list-style: none;margin: 0;padding: 0;float: left; line-height:42px;} /* Main format for top categories */
#menu ul ul{ position:relative; top:35px; left:5%; width: 90%;} /* child element widths */
#menu ul li{ background-position:bottom left;} /* set nav bg position */
#menu ul li:hover{ background-position:top left;} /* set nav bg position hover position */
/* Positioning popouts (2nd level only) */
#menu li {position: relative;} /* make "ABSOLUTE" work correctly */
#menu ul ul {position: absolute; z-index: 500;} /* prevent menu from "pushing" contents down */
#menu ul ul ul {position: absolute; top: 0; left: 100%;} /* move child elements to the side */
/* Hover behavior */
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}
div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}
/* Additional text formatting */
#menu a {display: block;width: 100%;height: 100%;}
#menu ul ul li {
font: bold 11px/16px arial, helvetica, sans-serif;
border-width: 0px 1px 1px 1px;
border-style: solid;
border-color: #ccc #323E6B #456594 #323E6B;
margin: 0;
padding: 3px 4px;
background: #2B3344;
}
#menu ul ul a {color: #CCC;text-decoration: none;}
#menu ul ul a:hover {color: #FFF;background:#06F;}
#centering_wrap {width:100%; position:relative;}
#menu {margin:0 auto;width: 955px;font: bold 11px/16px arial, helvetica, sans-serif;color:#666;} /* Main width and default font properties */
#menu ul {list-style: none;margin: 0;padding: 0;float: left; line-height:42px;} /* Main format for top categories */
#menu ul ul{ position:relative; top:35px; left:5%; width: 90%;} /* child element widths */
#menu ul li{ background-position:bottom left;} /* set nav bg position */
#menu ul li:hover{ background-position:top left;} /* set nav bg position hover position */
/* Positioning popouts (2nd level only) */
#menu li {position: relative;} /* make "ABSOLUTE" work correctly */
#menu ul ul {position: absolute; z-index: 500;} /* prevent menu from "pushing" contents down */
#menu ul ul ul {position: absolute; top: 0; left: 100%;} /* move child elements to the side */
/* Hover behavior */
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}
div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}
/* Additional text formatting */
#menu a {display: block;width: 100%;height: 100%;}
#menu ul ul li {
font: bold 11px/16px arial, helvetica, sans-serif;
border-width: 0px 1px 1px 1px;
border-style: solid;
border-color: #ccc #323E6B #456594 #323E6B;
margin: 0;
padding: 3px 4px;
background: #2B3344;
}
#menu ul ul a {color: #CCC;text-decoration: none;}
#menu ul ul a:hover {color: #FFF;background:#06F;}
...and here's the html from the menubar (which is contained in a separate php.includes, if that matters at all):
CODE
<div id="centering_wrap">
<div id="menu">
<ul style="width:195px;">
<li style="background-image:url(../images/nav_com_home.png);"><a href="http://www.skullcrow.com/" alt="Home"> </a>
<ul>
<li><a href="http://www.skullcrow.com/">Storefront</a></li>
<li><a href="http://www.skullcrow.com/community_home.php">Community</a></li>
</ul>
</li>
</ul>
<ul style="width:188px;">
<li style="background-image:url(../images/nav_com_store.png);"><a href="http://www.skullcrow.com/" alt="Store"> </a>
<ul>
<li><a href="http://www.skullcrow.com/">Shirts</a></li>
<li>Hats</li>
<li>Stickers</li>
<li>Misc Stuff</li>
</ul>
</li>
</ul>
<ul style="width:188px;">
<li style="background-image:url(../images/nav_com_community.png);"><a href="http://www.skullcrow.com/community_home.php" alt="Community"> </a>
<ul>
<li><a href="http://www.skullcrow.com/forum">Forum</a></li>
<li><a href="http://www.skullcrow.com/community_upload.php">Upload Photos</a></li>
<li><a href="http://www.skullcrow.com/community_designers.php">Submit Shirt Designs</a></li>
<li><a href="http://www.skullcrow.com/skullcrow_blog">SkullCrow Blog</a></li>
</ul>
</li>
</ul>
<ul style="width:188px;">
<li style="background-image:url(../images/nav_com_help.png);"><a href="http://www.skullcrow.com/help.php" alt="Help"> </a>
<ul>
<li><a href="http://www.skullcrow.com/help.php">Contact Us</a></li>
<li><a href="http://www.skullcrow.com/forum/faq.php">FAQ</a></li>
<li><a href="http://www.skullcrow.com/aboutus.php">About Us</a></li>
</ul>
</li>
</ul>
<ul style="width:196px;">
<li style="background-image:url(../images/nav_com_otherstuff.png);"><a href="#" alt="Other Stuff"> </a></li>
</ul>
</div>
</div>
<div id="menu">
<ul style="width:195px;">
<li style="background-image:url(../images/nav_com_home.png);"><a href="http://www.skullcrow.com/" alt="Home"> </a>
<ul>
<li><a href="http://www.skullcrow.com/">Storefront</a></li>
<li><a href="http://www.skullcrow.com/community_home.php">Community</a></li>
</ul>
</li>
</ul>
<ul style="width:188px;">
<li style="background-image:url(../images/nav_com_store.png);"><a href="http://www.skullcrow.com/" alt="Store"> </a>
<ul>
<li><a href="http://www.skullcrow.com/">Shirts</a></li>
<li>Hats</li>
<li>Stickers</li>
<li>Misc Stuff</li>
</ul>
</li>
</ul>
<ul style="width:188px;">
<li style="background-image:url(../images/nav_com_community.png);"><a href="http://www.skullcrow.com/community_home.php" alt="Community"> </a>
<ul>
<li><a href="http://www.skullcrow.com/forum">Forum</a></li>
<li><a href="http://www.skullcrow.com/community_upload.php">Upload Photos</a></li>
<li><a href="http://www.skullcrow.com/community_designers.php">Submit Shirt Designs</a></li>
<li><a href="http://www.skullcrow.com/skullcrow_blog">SkullCrow Blog</a></li>
</ul>
</li>
</ul>
<ul style="width:188px;">
<li style="background-image:url(../images/nav_com_help.png);"><a href="http://www.skullcrow.com/help.php" alt="Help"> </a>
<ul>
<li><a href="http://www.skullcrow.com/help.php">Contact Us</a></li>
<li><a href="http://www.skullcrow.com/forum/faq.php">FAQ</a></li>
<li><a href="http://www.skullcrow.com/aboutus.php">About Us</a></li>
</ul>
</li>
</ul>
<ul style="width:196px;">
<li style="background-image:url(../images/nav_com_otherstuff.png);"><a href="#" alt="Other Stuff"> </a></li>
</ul>
</div>
</div>
...and finally, here's the small snippet of code I used up in the header of the main php file that I thought was suppose to fix the display issue but didn't:
CODE
<!--[if IE]>
<style type="text/css" media="screen">
body {
behavior: url(css/csshover3.htc);
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}
#menu a, #menu h2 {
font: bold 0.7em/1.4em arial, helvetica, sans-serif;
}
</style>
<![endif]-->
<style type="text/css" media="screen">
body {
behavior: url(css/csshover3.htc);
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}
#menu a, #menu h2 {
font: bold 0.7em/1.4em arial, helvetica, sans-serif;
}
</style>
<![endif]-->
That last bit is contained at the very of the header, and is the very last item before the </head> tag. In addition to the other 'adjustments', it's also suppose to be including the csshover3.htc file that I thought was suppose to fix a lot of display problems. The site I got that file from is here: http://www.xs4all.nl/~peterned/csshover.html
Whatever help is always very appreciated. I'm still sort of a css newb, although I think I'm starting to understand more, but IE is a *beep* and I think most web developers would probably agree.
Thanks again.