<style type="text/css">
#info {
POSITION: relative
}

body {
margin: 0px;
padding: 5px;
font-family: Helvetica, Verdana, Tahoma, sans-serif;
color: #000;
}

p.bold {
PADDING-LEFT: 15px; COLOR: #fff
}
a.linkup {
POSITION: relative
}
a.buttonup {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; LEFT: 650px; BORDER-BOTTOM-WIDTH: 0px;
POSITION: absolute; TOP: 200px; BORDER-RIGHT-WIDTH: 1px
}
a.buttonup img {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px;
BORDER-RIGHT-WIDTH: 0px
}
.gleft {
FLOAT: left; MARGIN: 25px 0px 0px
}
.gright {
FLOAT: right; MARGIN: 25px 5px 0px 0px
}
.grc {
MARGIN: 20px 0px 0px 10px
}
.menu {
BORDER-RIGHT: #fff 1px solid; FONT-SIZE: 0.85em; Z-INDEX: 100; WIDTH: 745px; POSITION: relative;
HEIGHT: 50px
}
html .menu {
WIDTH: 800px
}

<!-- menu margin from left of page -->
.menu ul {
PADDING-RIGHT: 0px; PADDING-LEFT: 50px; PADDING-BOTTOM: 20px; MARGIN: 0px; PADDING-TOP: 0px;
LIST-STYLE-TYPE: none
}
.menu ul ul {
WIDTH: 129px
}

<!-- top menu width between each box -->
.menu li {
FLOAT: left; WIDTH: 139px; POSITION: relative
}
.menu a {
BORDER-RIGHT: #fff 0px solid; BORDER-TOP: #fff 1px solid; DISPLAY: block; PADDING-LEFT: 10px;
FONT-SIZE: 13px; BACKGROUND: #cd4039; BORDER-LEFT: #fff 1px solid; WIDTH: 138px; COLOR: #fff; LINE-HEIGHT:
29px; BORDER-BOTTOM: #fff 1px solid; HEIGHT: 30px; TEXT-DECORATION: none
}

<!-- menu font size, margin, height -->
.menu a:visited {
BORDER-RIGHT: #fff 0px solid; BORDER-TOP: #fff 1px solid; DISPLAY: block; PADDING-LEFT: 10px;
FONT-SIZE: 14px; BACKGROUND: #cd4039; BORDER-LEFT: #fff 1px solid; WIDTH: 128px; COLOR: #fff; LINE-HEIGHT:
29px; BORDER-BOTTOM: #fff 1px solid; HEIGHT: 30px; TEXT-DECORATION: none
}
 html .menu a {
WIDTH: 118px
}

<!-- top menu width -->
 html .menu a:visited {
WIDTH: 128px
}

<!-- menu font size, margin, height -->
.menu ul ul {
BORDER-TOP: #000 0px solid; LEFT: 0px; VISIBILITY: hidden; WIDTH: 129px; POSITION: absolute; TOP: 41px;

HEIGHT: 0px
}
 html .menu ul ul {
TOP: 31px
}
.menu ul ul ul {
LEFT: 149px; WIDTH: 149px; TOP: -1px
}
.menu ul ul ul.left {
LEFT: -149px
}

<!-- placement of first sub menu links -->
.menu table {
LEFT: -50px; POSITION: absolute; TOP: 1px; BORDER-COLLAPSE: collapse
}
.menu ul ul a {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BORDER-LEFT-WIDTH: 1px;
BACKGROUND: #cd4039; BORDER-BOTTOM-WIDTH: 1px; PADDING-BOTTOM: 5px; WIDTH: 128px; COLOR: #fff;
LINE-HEIGHT: 1em; PADDING-TOP: 5px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 1px
}

<!-- spacing between sub menu links -->
.menu ul ul a:visited {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 10px; BORDER-LEFT-WIDTH: 1px;
BACKGROUND: #cd4039; BORDER-BOTTOM-WIDTH: 1px; PADDING-BOTTOM: 5px; WIDTH: 128px; COLOR: #fff;
LINE-HEIGHT: 1em; PADDING-TOP: 5px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 1px
}
 html .menu ul ul a {
WIDTH: 128px
}

<!-- width of sub menu links -->
 html .menu ul ul a:visited {
WIDTH: 128px
}
.menu a:hover {
BACKGROUND: #000000; COLOR: #fff
}
.menu ul ul a:hover {
BACKGROUND: #000000; COLOR: #fff
}
unknown {
BACKGROUND: #ffffff; COLOR: #fff
}
.menu ul li:hover ul {
VISIBILITY: visible
}
.menu ul a:hover ul {
VISIBILITY: visible
}
.menu ul :hover ul ul {
VISIBILITY: hidden
}
.menu ul :hover ul :hover ul {
VISIBILITY: visible
}
</style>

<div class="menu">
<ul>

<li><a  href="Archives/Menu.html">Archives<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a  href="Data/Menu.html">Data<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a href="#">Championships<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul>
<li><a href="EPL/Menu.html">English Premier League</a></li>
<li><a href="Seriea/Menu.html">Serie A</a></li>
<li><a href="UCL/Menu.html">UEFA Champions League</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a href="#">Multimedia<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul>
<li><a href="Multimedia/Menu.html">Audio & Video</a></li>
<li><a href="http://www.soccer-europe.com/gallery/main.php">Photo Gallery</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a  href="Transfers/Menu.html">Transfers<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>

quote:

ORIGINAL: rdouglass

I can't address the CSS specifically but it really looks trashed in FF. My general rule of thumb is to make things look the way I want them in FF then adjust for IE. You will see sooooo many more of your issues right away in FF and can fix them before they compound into something like this.

Another thing, are you publishing *all* the correct CSS files, JS, files and any other associated stuff to the live site? I have found that sometimes the paths are different on some of my localhost webs and the CSS needs adjustment (in terms of paths and such)