Bug 20946 – REGRESSION: Invalid CSS @media query should be ignored but isn't

• Component: CSS
• Status: RESOLVED INVALID

[Chris Petersen]

* SUMMARY
With Webkit NB r36640 , a invalid CSS @media query should be ignored but isn't. This problem was originally found at http://store.iomega.com/section?SID=f2e44e869a9564289240548cef0a492cc48:4760&secid=40299.

I have reduced it down with Tim H to a simple test case.

<style>
.test {
	background-color: green;
	width: 20px;
	height: 20px;
}

@media screen {

/* Any style rules after this will be ignored. */

.test {
	display: none;
}
</style>

<div class="test"></div>

* STEPS TO REPRODUCE
1. Open the attached file "iomega.html" in Safari 3.1.
2. Notice a green square (< DIV> ) appears on this page
3. Now, open this same test case in TOT. Notice the green square doesn't appear on the page at all.

The display: none; rule is being processed even thought it shouldn't be ( since the @media query is not valid)

[Chris Petersen]

Created attachment 23577 [details]
Reduced test case

[Chris Petersen]

<rdar://problem/6232970>

[Anatoli Papirovski]

The @media query is valid! See here http://www.w3.org/TR/CSS21/syndata.html#parsing-errors - specifically the section about "Unexpected end of style sheet".

[Anatoli Papirovski]

More information: Firefox 3 gets this wrong, Opera 9.5 gets it right.

[Robert Blaut]

(In reply to comment #3)
> The @media query is valid! See here
> http://www.w3.org/TR/CSS21/syndata.html#parsing-errors - specifically the
> section about "Unexpected end of style sheet".
> 

I agree with Anatoli. The reported style sheet is absolutely correct.

(In reply to comment #4)
> More information: Firefox 3 gets this wrong, Opera 9.5 gets it right.
> 

Firefox 3.1 beta 2 has this bug fixed. 

I close this bug as INVALID since it doesn't describe a real bug.