views:

502

answers:

4

I get a strange syntax error in Firefox 3.0.10/Leopard when using the following html/css:

foo.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd"&gt;

<html lang="en">
<head>
  <link rel="stylesheet" href="foo.css"/>
</head>
<body>
Foo
</body>
</html>

foo.css:

div {
  color: #FF0000;
}

and the error I get in the console is:

Error: syntax error
Source File: file://path/to/foo.css
Line: 1, Column: 1
Source Code:
div {

It's not the CSS, because pasting it into the body of an inline STYLE tag works fine. It's not the link tag, because pointing the HREF to stack overflow's css file doesn't give an error. Feels like a Firefox bug, but I can't find any documentation on it. Is this a known issue, and is there a workaround? It makes it hard to debug or validate.

Thanks.

A: 

Was the file written on windows? Maybe you need to reformat the carriage return/new line to mac os x. try running the file through something like dos2unix on the command line. Could also be a bom you're not seeing.

apphacker
nope - written in TextMate. Tried fooling with line endings anyway to no avail.
Matt Van Horn
A: 

My guess is that there's some hidden character that might have been accidentally saved in the file. Try re-saving the CSS file, or re-typing the first line and then re-saving it.

htw
Tried this too. retyped it all carefully, still get the error. And still no error when I cut and paste it into a script tag, which I would expect if I was picking up special characters. (the line number means nothing, I discovered - it always reports 1/1 for an external css file, no matter what line the actual error is on)
Matt Van Horn
+1  A: 

It's giving you the error on the first character in the file, which is a 'd', which rules out things like "hidden" special characters to me. I'd guess that firefox isn't able to open the file locally for whatever reason, or that the file was accidentally saved with an encoding that, although it displays fine in the dialog box, doesn't parse normally. Perhaps it's saved as Unicode by mistake?

If you could link us to the actual file it would help, since your syntax (despite the markup not being exactly valid, but I don't think that's it) is perfect in the .css file you pasted in.

Nicholas Flynt
apphacker seems to have beaten me to the punch: sounds like the Unicode bom is what's causing it.
Nicholas Flynt
A: 

The answer turned out to be "Turn off extensions (it was YSlow)" as suggested in the comments.

Matt Van Horn