Log in

View Full Version : CSS Menu is off on Firefox



Morocco
03-30-2010, 01:08 AM
Greetings -

I have this site called: www.FLIC.us using CSS Menu which looks fine on IE, but on Firefox or Mac users, the Menu floats about 30px down from the top.

I tried to use hack override
!important; but still couldn't get it to work.

Here is what I did:


#menu {
top: 0px!important;
top: 0px;
margin:0;
padding:0;
list-style:none;
font-size:11pt;
font-weight:bold;
line-height:normal;

I changed top px value around, still couldn't get it to work.


Here is my CSS below, you can see my site at FLIC.us on firefox to see the issue. I'd appreciate any help you can provide:



/* CSS Document */
html {
height: 100%;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
text-align: center;
height: 100%;
min-height: 100%;

}
#menubackground {
/* float:left;*/
width:100%;
background:#F2B358;
width: 812px;
height: 30px;
margin: 0 auto;
}
#menu {
margin:0;
padding:0;
list-style:none;
font-size:11pt;
font-weight:bold;
line-height:normal;

}
#menu li {
float:left;
margin:0;
padding:0;
width:115px;
height:30px;

}
/* DH change menu width here and change menubackground to 812 from 750 on this page */
#menu a {
color: #FFFFFF;
text-decoration: none;
outline:none;
display:block;
margin: 0 auto;
width: 115px;
height: 30px;
text-align: center;
padding: 5px 0px;
}
a.mainheaderlink {
background: url(http://www.flic.us/images/link1.jpg) no-repeat left top;}
a.endheaderlink {
background: url(http://www.flic.us/images/link2.jpg) no-repeat left top;}
a.mainheaderlink:hover {
background: url(http://www.flic.us/images/link3.jpg) no-repeat left top;}
a.endheaderlink:hover {
background: url(http://www.flic.us/images/link4.jpg) no-repeat left top;}




/* Header
#headerlogoimage {
width: 812px;
height: 50px;
margin: 0 auto;
background: url(http://www.flic.us/images/header_top.jpg) no-repeat center center;
}
*/
#headermainimage {
width: 812px;
height: 175px;
margin: 0 auto;
background: url(http://www.flic.us/images/flic-banner6d1.jpg) no-repeat center center;
}

Morocco
03-30-2010, 02:12 AM
My apologies, I found the issue. Actually, it has nothing to do with CSS. I found 1px blank.gif within my code that was putting my Menu off..

Thanks.