I have the Css menu working "nearly" perfectly with two small exceptions. Suggestions would really be appreciated. In IE6 and in Opera the left border is mission around the main box. Fine in FF. In all browsers I'm getting what appears a double line beteen Specials, New Products and All Products vs. the 1 px line. I've tried removing the bottom border, however it removes all lines except those. Of course then I only have a 1px line between the previously mentioned items. So I would think the bottom border for those items is being pulled from somewhere else... where I'm not exactly sure. I've gone all through the two style sheets and did not find anything that jumped out at me.
Any help would really be appreciated.
Link to the site: http://69.50.202.136/
Here's my stylesheet_categories_menu.css
body { behavior: url(includes/csshover.htc);} /* WinIE behavior call */
div#nav-cat {float: left; width: 180px; margin: -1px 0 0 -1px;
background-color: #7C0425; font-weight:normal;}
div#nav-cat ul {margin: 0; padding: 0; width: 180px; background-color: #000000;
border: 1px solid #7C0425;}
div#nav-cat ul.level2 {background-color: #000000;}
div#nav-cat ul.level3 {background-color: #000000;}
div#nav-cat ul.level4 {background-color: #000000;}
div#nav-cat ul.level5 {background-color: #000000;}
div#nav-cat ul.level6 {background-color: #000000;}
div#nav-cat li {position: relative; list-style: none; margin: 0;
margin-top: 5px; /* change it to whatever space you want to put space between buttons*/
border-bottom: 1px solid #7C0425; <---this line may help or hinder IE menu shifting issues */
}
div#nav-cat li li {
margin: 0; /* this overrides the margin-top in the declaration above */
}
div#nav-cat li:hover {background-color: #7C0425;}
div#nav-cat li.submenu {
background: url(../images/submenu.gif) 95% 50% no-repeat;
background-color: #000000;}
div#nav-cat li.submenu:hover {background-color: #7C0425;}
div#nav-cat li a {display: block; padding: 0.25em 0 0.25em 0.5em;
text-decoration: none; width: 180px; color: white;}
border-left: 0.5em solid #BBB;}
div#nav li a:hover {border-left-color: #7C0425;}
div#nav-cat>ul a {width: auto;}
div#nav-cat ul ul {position: absolute; top: 0; left: 180px;
display: none;}
div#nav-cat ul.level1 li.submenu:hover ul.level2,
div#nav-cat ul.level2 li.submenu:hover ul.level3,
div#nav-cat ul.level3 li.submenu:hover ul.level4,
div#nav-cat ul.level4 li.submenu:hover ul.level5,
div#nav-cat ul.level5 li.submenu:hover ul.level6 {display:block;}
Bookmarks