Locate CSS Error Location
My page throws errors in Firefox Nightly such as
Expected color but found ‘undefined’. Error in parsing value for ‘background-color’. Declaration dropped. preview.htm:1:1
and
Expected color but found ‘undefined’. Error in parsing value for ‘color’. Declaration dropped. preview.htm:1:1
The page references ten CSS files besides having dozens of its own CSS declarations. The issue is tha the reference provided to the error (:1:1) does not indicate where I can find the error. That is, I don't know which declaration is at fault. Is there some straighforward way to find the declaration in question?
所有回覆 (14)
I'm guessing it's my CSS but the issue is that there appears to be no way for me to tell which declaration throws the error.
You should post your css edits to a css forum and have someone there look to see if there is corrections to be made to the custom user css.
The issue is not that there's a CSS error but that Firefox, though acknowledging there is an error, does not provide any useful information as to where the error occurred.
You probably are using minified files that consist of one long line to optimize loading and not the original files with line breaks and thus Firefox can't show where this error occurs. If you see preview.htm:1:1 then this means that you have embedded the CSS rules in the main HTML file. You can try an online CSS validate website to check for issues.
Thanks for the reply. My CSS is not minified (perhaps there's some 3rd party extension's CSS that Firefox is finding?) At any rate the CSS validator cannot handle container nor nested queries.
How many rules do you have for background-color -- one of those is the problem.
I have validated my CSS successfully (except the validator doesn't support nested nor container queries).
Chrome does not indicate that there is any CSS problem.
The page appears to display correctly.
When I trudge through all the elements via the developer panel there is no indication that there is any invalid CSS declaration - though that might be because I "missed" the element.
The issue is that Firefox reports an error but does not indicate where or what caused the error.
I would expect that if there is an error that Firefox would actually show the offending code.
Maybe that this is simply a rule that Firefox doesn't support but meant for other browsers, this can lead to all kind of mysterious error messages and can usually ignored. Is this a message in the Web Console?
Without Firefox indicating the actual offending code I can't know whether to ignore it or not.
Do you have any CSS dynamically generated or modified by a script? That's the only way I could imagine a color or background-color being set to "undefined".
My I guess you're saying that if some scripting is trying to set an invalid value for background-color then Firefox cannot indicate where the failure occurs. In which case the error message should be changed to something like "An attempt was made by JavaScript to set background-color for [specify the element] to an invalid value."
I'm just trying to interpret the error message so you have more leads in tracking it down. I have no idea what the answer is.
You can open the Style Editor (Shift+F7), and Ctrl+F for undefined in each style sheet to see whether it's in there.
I have searched all the background-color declarations, both in the code as written and as displayed within the Style Editor. I've come to accept that the error details are less than useful.