quotes-036.xht (4530B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>CSS Test: CSS and Quotes: Counting Right (Evil Version)</title> 5 <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> 6 <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/quotes/002.xml" type="application/xhtml+xml"/> 7 <link rel="help" href="http://www.w3.org/TR/CSS21/generate.html#quotes" /> 8 <link rel="match" href="quotes-035-ref.xht"/> 9 <meta name="flags" content="may"/> 10 <style type="text/css"> 11 <![CDATA[ 12 .party1 * { display: inline; } 13 .party1 .a { quotes: "Isn" "'" 14 "t" "FAIL!" 15 "FAIL!" " i"; } 16 .party1 .b { quotes: "" "FAIL!!" 17 " wonderful" "!!!" 18 " to " " work" 19 "see " " [FAIL to]" 20 "C" "quotes" 21 "S" " "; } 22 .party1 .c { quotes: none; } 23 .party1 .d { quotes: "FAIL!" "FAIL!" 24 "FAIL!" "FAIL!" 25 "" ""; } 26 .test { margin-left: 2em; } 27 .test .no-open:before { content: no-open-quote; } 28 .test .open:before { content: open-quote; } 29 .test .triple-open:before { content: open-quote open-quote open-quote; } 30 .test .no-close:after { content: no-close-quote; } 31 .test .triple-no-close:after { content: no-close-quote no-close-quote no-close-quote; } 32 .test .close:after { content: close-quote; } 33 .test .triple-close:after { content: close-quote close-quote close-quote; } 34 .test .no-close-open:before { content: no-close-quote open-quote; } 35 36 /* hr br */ 37 .test hr, .test br { display: inline; margin: 0; padding: 0; 38 height: auto; width: auto; border: none; color: inherit; 39 background: transparent; } 40 .test br:before { content: "" } 41 .test br:after { content: "" } 42 ]]> 43 </style> 44 </head> 45 <body> 46 47 <!-- Isn't it wonderful to see CSS quotes work!!! 48 --><div class="test c party1"><!-- c 0 49 --><div class="a open close"><!-- open a 1 isn 50 --></div><!-- close a 0 ' 51 --><div class="a"><!-- a 0 52 --><div class="c open"><!-- open c 1 53 --><div class="a open"><!-- open a 2 t 54 --></div><!-- a 2 55 --></div><!-- c 2 56 --><div class="no-open close"><!-- a 3 [FAIL!] 57 --></div><!-- close a 2 i 58 --></div><!-- a 2 59 --><div class="no-close-open no-close a"><!-- a 2 [FAIL!] t 60 --></div><!-- close a 1 61 --><div class="d no-open no-close"><!-- open d 2 [FAIL!] 62 --><div class="open close"><!-- open d 3 63 --><div class="open close"><!-- open d 4 64 --></div><!-- close d 3 65 --></div><!-- close d 2 66 --></div><!-- close d 1 [FAIL!] 67 --><div class="b no-close"><!-- b 1 68 --><br class="triple-no-close"/><!-- close b 0 [FAIL!!] <<< EVIL 69 --><hr class="triple-open"/><!-- open x 3 b 3 "", "wonderful ", "to " <<< EVIL 70 --><br class="triple-open"/><!-- open x 3 b 6 "see ", "C", "S" <<< EVIL 71 --><div class="open close"><!-- open b 7 S 72 --><div class="close"><!-- b 7 73 --><div class="no-close"><!-- b 7 74 --><div class="close"><!-- b 7 75 --><div class="no-close"><!-- b 7 76 --><div class="close"><!-- b 7 77 --></div><!-- close b 6 " " 78 --></div><!-- close b 5 [" "] 79 --></div><!-- close b 4 quotes 80 --></div><!-- close b 3 [ FAIL to] 81 --></div><!-- close b 2 work 82 --></div><!-- close b 1 !!! 83 --></div><!-- close b 0 [FAIL!!] 84 --></div><!-- b 0 85 --> 86 87 </body> 88 </html>