My CSS displays correct in IE but not in Firefox. The text color, font, and table width is messed up in FF. I don't know what a parse error is and that's what the validator is telling me. How can I fix that?

The page:
http://project2am.webs.com

CSS:
http://project2am.webs.com/css.html

That's because it's a HTML file containing html tags. There are even SCRIPT tags, but I suppose these are added by your host in HTML files.

All there should be in a CSS file is what you have between the <style...></style> tags. And the file should have a .css extension, eg: styles.css. Adapt your LINK in your HTML page accordingly:

from:
<link rel=stylesheet href="http://project2am.webs.com/css.html" type="text/css">

to eg:
<link rel=stylesheet href="styles.css" type="text/css">
(no need to put the full url, a relative path is sufficient.

So I dont need ANY tags, just the CSS? Like starting with

body {

and so on?

Oh that worked. You learn something new every day!

Thank you so much.

Glad to hear that and you're welcome.

I am having a similar problem. My site works perfectly in IE, but not Firefox. In Firefox, my header, footer, and background images are all correct. The content/body, however, is all off to the far right.

I am brand new when it comes to all of this, so I am not familiar with problem solving at all. This is the first time I have ever used CSS or HTML. Another person built the base of it (the CSS page and the basic HTML design) and I just filled in content and any other pages I needed to add.

My site is www.edmontonseahawksfootball.com

The CSS is

body
{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;

background-image:url('images/Seahawks.gif');
}

#container
{
float: center;
width: 800px;
margin: 0 auto;

background-image: url('images/football2-V02.jpg');
}

#header
{
height: 100px;

border-style: solid;
border-color: darkblue;

border-left-width: 1px;
border-right-width: 1px;
border-top-width: 1px;
border-bottom-width: 1px;
}

#wrapper
{
margin-top: 0px;
margin-bottom: 0px;
}

#content
{
float: center;
width: 798px;

border-color: darkblue;
border-style: solid;

border-left-width: 1px;
border-right-width: 1px;
border-top-width: 1px;
border-bottom-width: 1px;

height: 490px;

overflow: scroll;
overflow-x: hidden;

scrollbar-base-color: transparent;
scrollbar-arrow-color: green;


}

#content h1
{
color: darkblue;
text-align: center;
}

#content h2
{
color: blue;
text-align: center;
vertical-align: center;
}

#sponsor
{
width: 798px;
clear: both;

float: center;

border-color: darkblue;
border-style: solid;

border-left-width: 1px;
border-right-width: 1px;
border-top-width: 1px;
border-bottom-width: 1px;
}

#footer
{
width: 798px;
clear: both;

float: center;

border-color: darkblue;
border-style: solid;

border-left-width: 1px;
border-right-width: 1px;
border-top-width: 1px;
border-bottom-width: 1px;
}



table.sample
{
border-color: blue;
border-collapse: collapse;
}

table.sample th
{
border-width: 2px;
border-style: solid;
border-color: blue;

padding-left: 5px;
padding-right: 5px;

font-weight: bold;
}

table.sample td
{
border-width: 2px;
border-style: solid;
border-color: green;
}



table.sponsor
{
border-color: blue;
border-collapse: collapse;
background-color: #99FF99;
}

table.sponsor td
{
border-width: 0px;
border-style: solid;
border-color: lightblue;

font-weight: bold;
}



table.bio
{

}

table.bio th
{
border-width: 0px;

letter-spacing:2px;

font-size:x-large;
font-weight: bold;

text-align: left;
text-transform:uppercase;
}

table.bio td
{
border-width: 0px;
}








Any help at all would be greatly, greatly appreciated!! Thank you.

Use the validators to help you fix the errors to start with.

http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

http://jigsaw.w3.org/css-validator/validat...g=1&lang=en

Ask if you need help. If the problem remains when the errors are gone, it will be easier to identify what causes it.

Thank you.

In the second link it tells me the float center is not a float value.

Also, this is listed...

43 .ddcolortabs ul Property font-stretch doesn't exist in CSS level 2.1 but exists in [css1, css2, css3] : normal

73 .ddcolortabs a In (x)HTML+CSS, floated elements need to have a width declared. Only elements with an intrinsic width (html, img, input, textarea, select, or object) are not affected

102 .ddcolortabs a span In (x)HTML+CSS, floated elements need to have a width declared. Only elements with an intrinsic width (html, img, input, textarea, select, or object) are not affected



I do not know how to correct any of that.

In the first one, it tells me:

# Line 32, character 41:

... <img src="images/banner.jpg"/></center>
^

Error: required attribute alt not specified


I don't know what that means.


Sorry, I know I seem clueless to people on here. It is pretty much because I am clueless when it comes to this. Long story short, I got thrown into this and I have a lot of pressure on me to get this site up. I wasn't the one that created the site, I just had to add things to it because it wasn't done how we had asked.
Thank you very much for the help.

That isn't how you center things in CSS. See Centring using CSS and Centering things.

You're validating against CSS 2.1 (probably the best choice unless you have a good reason to use some other version of CSS), but the font-stretch property doesn't exist in CSS 2.1. Given that you're specifying "font-stretch: normal", the obvious fix is to just delete that propery from your style sheet.

So, either stop floating the element, or declare a width.

See Use of ALT texts in IMGs.