at-media-content-001.html (1415B)
1 <!doctype html> 2 <head> 3 <title>CSS Test (Conditional Rules): Invalid rules inside @media</title> 4 <!-- This test is paired with at-supports-content-001.html ; please keep them in sync --> 5 <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"> 6 <link rel="help" href="https://www.w3.org/TR/css-conditional-3/#contents-of"> 7 <link rel="help" href="https://www.w3.org/TR/css-conditional-3/#at-media"> 8 <link rel="match" href="at-supports-001-ref.html"> 9 <meta name="assert" 10 content="Test passes if invalid rules within @media do not invalidate the @media rule."> 11 <style> 12 div { 13 background: red; 14 height: 20px; 15 width: 100px; 16 } 17 18 @media all { 19 @import "support/fail.css"; 20 .test1 { background: green; } 21 } 22 @media all { 23 @namespace foo "http://www.w3.org/"; 24 .test2 { background: green; } 25 .test2:not(foo|div) { background: red; } 26 } 27 @media all { 28 @charset "utf-8"; 29 .test3 { background: green; } 30 } 31 @media all { 32 @unknown; 33 .test4 { background: green; } 34 } 35 @media all { 36 .test5 { background: green; } 37 @unknown { 38 .test5 { background: red; } 39 } 40 } 41 </style> 42 </head> 43 <body> 44 <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> 45 <div class="test1"></div> 46 <div class="test2"></div> 47 <div class="test3"></div> 48 <div class="test4"></div> 49 <div class="test5"></div> 50 </body> 51 </html>