can someone help me?

[Jago6060]

http://www.caironewyorkrotary.org

 

please check out this site in FF and see if you can figure out why the lettering on the first button is so far off.  here is my external CSS file.

 

html            {
                margin: 0px;
                padding: 0px;
                }
body		{
	padding: 0px;
                margin: 0px;
	background-image: url(crc_bg.png);
	background-attachment: fixed;
	background-position: top center;
	background-repeat: repeat-x;
	scrollbar-highlight-color: #FFFF99;
	scrollbar-shadow-color: #FFFF99;
	scrollbar-track-color: #FFFF99;
	scrollbar-face-color: #000060;
	scrollbar-arrow-color: #FFFF99;
	}
#topbar	{
	background: #000060;
                color: #FFFF99;
	width: inherit;
                margin: 1px;
	position: relative;
	}
#console	{
	background: #FFFF99;
                width: 750px;
	position: absolute;
                top: 4px;
                left: 260px;
	font-family: "Lucida Handwriting";
	height: inherit;
                margin-bottom: 4px;
	}
#button 	{
                background: #000060;
	font-size: small;
	font-family: "Tahoma";
	width: 212px;
	height: 24px;
	padding-top: 12px;
	padding-left: 10px;
                padding-bottom: 8px;
	margin-left: 1px;
                margin-top: 1px;
                margin-bottom: 1px;
	}
#leftbar	{
	background: #000060;
	position: relative;
	font-size: x-small;
	font-family: "Tahoma";
	color: #FFFF99;
	width: 212px;
	height: inherit;
	margin: 1px;
                padding-left: 5px;
                padding-top: 3px;
                padding-right: 5px;
	}
#logo		{
	background: #FFFF99;
                color: #000060;
	position: relative;
	height: 80px;
	width: inherit;
	font-family: "Times New Roman";
                margin-bottom: 5px;
	}
#bottombar	{
	background: #000060;
	font-family: "Tahoma";
	font-size: x-small;
	color: #FFFF99;
	height: 12px;
	margin: 1px;
                padding-bottom: 3px;
	width: inherit;
	position: relative;
	}
#text		{
	font-family: "Tahoma";
	font-size: small;
                overflow: scroll;
	background: #FFFF99;
	color: #000060;
	width: 524px;
	height: 653px;
	float: right;
	position: absolute;
                left: 225px;
                top: 306px;
	}
#slideshow	{
	background: #FFFF99;
	margin: 1px;
	float: right;
	position: relative;
	width: 524px;
	}
p		{
         	text-indent: .50in;
	}
#trans		{
	height: 300px;
	width: 300px;
	float: right;
	position: fixed;
	filter:alpha(opacity=10);
	}
#motto		{
	height: 393px;
	width: 45px;
	position: absolute;
	left: 224px;
	top: 125px;
	}
#banner		{
	width: 195px;
	height: 94px;
                position: relative;
                left: 6px;
	background-color: #000060;
	background-image: url(banner.png);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center center;
	color: #FFFF99;
	font-family: "Tahoma";
	font-size: small;
	margin: 1px;
	}

a.one:link	{color: #FFFF99; text-decoration: none;}
a.one:visited	{color: #FFFF99; text-decoration: none;}
a.one:hover	{color: #000060; text-decoration: none;}
a.one:active	{color: #FFFF99; text-decoration: none;}

a.two:link	{color: #FFFF99; text-decoration: none; font-size: small;}
a.two:visited	{color: #FFFF99; text-decoration: none; font-size: small;}
a.two:hover	{color: #FFFF99; text-decoration: none; font-size: small;}
a.two:active	{color: #FFFF99; text-decoration: none; font-size: small;}

a.three:link	{color: #000060; text-decoration: none;}
a.three:visited	{color: #000060; text-decoration: none;}
a.three:hover	{color: #000060; text-decoration: none;}
a.three:active	{color: #000060; text-decoration: none;}

a.banner:link	{color: #FFFF99; text-decoration: none;}
a.banner:visited{color: #FFFF99; text-decoration: none;}
a.banner:hover	{color: #FFFF99; text-decoration: none;}
a.banner:active	{color: #FFFF99; text-decoration: none;}

[ToonMariner]

That html soup is difficult to digest...

 

I suggest that you validate your markup http://validator.w3.org/ first - it needs to attention before we can really begin to help AND may solve you problem.