PDA

View Full Version : Help Validating my CSS file?



Jim Nayzium
Nov 14th, 2006, 02:15 AM
I have just spent 3 hours getting my HTML / PHP to validate using the transitional 1.0 at w3c...it was pretty rewarding.

http://mikebake.p194.pandawebsites.com/Staging-StudioAuditions/index_css_template7.php -- Check it out!!! I am very proud (my first actual valid markup!!)

I was instructed in a thread to make sure my HTML is valid before submitting questions about it...well I did it!!

Now the hard part...the CSS validation. I am new enough at this that I am really just confused.

I have used bits and pieces of css files from phpBB2 forums that I host, and from 68classifieds.com that I host, and I am afraid I have put some things togther in such a way as to create a problem.

My main problem is it all is working perfectly in Firefox and IE and netscape just like I want it to...and Safari even.

BUT -- the validation service at w3c goes crazy when it reads my css file...

I really don't even know what some of this stuff means.

It took me 3-4 hours to finally get my html to verify...because I was using tons of includes and a dreamweaver template...wow that was a bear...

But now, I just really don't even know where to start with these error messages...


Please Advise...

http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fmikebake.p194.pandawebsites.com%2FStaging-StudioAuditions%2Fcss%2Fstudioauditions_main.css&usermedium=all

kaitco
Nov 14th, 2006, 05:40 AM
A lot of these are a bit self-explanatory, for example:


Line: 22 Context : .floatedImageLeftTop
Invalid number : position top is not a position value : top
This is just saying that "top" is not an actual value of the attribute "position." I think you might mean "position: relative;" or "vertical-align: top;"



Line: 353 Context : .topnav

Property valign doesn't exist : middle
The same thing here: "valign" is not a property of CSS.


The second error gives you a link to follow. I suggest you read the material presented in that link.



# Line: 196 Context : body

Property scrollbar-3dlight-color doesn't exist : #6a6a6a
# Line: 197 Context : body

Property scrollbar-arrow-color doesn't exist : #fc9b00
# Line: 198 Context : body

Property scrollbar-darkshadow-color doesn't exist : #000000
# Line: 199 Context : body

Property scrollbar-face-color doesn't exist : #444444
# Line: 200 Context : body

Property scrollbar-highlight-color doesn't exist : #444444
# Line: 201 Context : body

Property scrollbar-shadow-color doesn't exist : #000000
# Line: 202 Context : body

Property scrollbar-track-color doesn't exist : #2e2e2e

I will give you the advice someone gave me: do not disturb the user interface, ie: the scrollbars. These changes do not appear in browsers like FF anyway.


Take a look at the CSS documentation from the W3C: CSS1 (http://www.w3.org/TR/REC-CSS1) and CSS2 (http://www.w3.org/TR/REC-CSS2/). Also, look at the CSS reference from W3Schools (http://www.w3schools.com/css/css_reference.asp). These could help you understand which properties and attributes are valid and eliminate potential mistakes.