| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" |
| "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head> |
| <title>CSS Test: Ignoring at-rules inside @media blocks</title> |
| <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> |
| <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors"/> |
| <link rel="help" href="http://www.w3.org/TR/CSS21/media.html#at-media-rule"/> |
| <link rel="match" href="at-rule-013-ref.xht"/> |
| <meta name="flags" content="invalid"/> |
| <meta name="assert" content="At-rules inside @media blocks are ignored up to |
| up to the end of the block that contains the invalid at-keyword, or up |
| to and including the next semicolon (;) or up to and including the next |
| block ({...}), whichever comes first."/> |
| <style type="text/css"><![CDATA[ |
| p { |
| color: red; |
| background: red; |
| } |
| @media all { |
| #semicolon { background: transparent; } |
| @foo ] & | # $ % test-token \ |
| [; # { background: red; } ] |
| (; #semicolon { background: red; } } } } ) |
| '; #semicolon { background: red; } } } }', |
| "; #semicolon { background: red; }' } } }" |
| ; |
| #semicolon { color: green; } |
| } |
| @media all { |
| #block { background: transparent; } |
| @foo ] & | # $ % test-token \ |
| [; #block { background: red; } ] |
| (; #block { background: red; } ) |
| '; #block { background: red; }', |
| "; #block { background: red; }'" |
| {; #block { background: red; } |
| #block { background: red; } } |
| #block { color: green; } |
| } |
| @media all { |
| #eob { background: transparent; } |
| @import "support/import-red.css" |
| } |
| #eob { |
| color: green; |
| } |
| @media all { |
| #eob-complex { background: transparent; } |
| @import "support/import-red.css" |
| [; #eob-complex { background: red; } ] |
| (; #eob-complex { background: red; } ) |
| '; #eob-complex { background: red; }', |
| "; #eob-complex { background: red; }'" |
| } |
| #eob-complex { |
| color: green; |
| } |
| ]]></style> |
| </head> |
| <body> |
| <p id="semicolon">This sentence must be green.</p> |
| <p id="block">This sentence must be green.</p> |
| <p id="eob">This sentence must be green.</p> |
| <p id="eob-complex">This sentence must be green.</p> |
| </body> |
| </html> |
