selection-overlay-and-grammar-001-ref.html (1322B)
1 <!DOCTYPE html> 2 3 <html lang="en"> 4 5 <meta charset="UTF-8"> 6 7 <title>CSS Reftest Reference</title> 8 9 <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> 10 11 <link rel="stylesheet" href="../support/highlights.css"> 12 <style> 13 #ref 14 { 15 font-size: 60px; 16 position: relative; 17 color: transparent; 18 } 19 20 #ref > div 21 { 22 position: absolute; 23 } 24 25 #grammar-error > span 26 { 27 background-color: yellow; 28 } 29 30 #selection > span 31 { 32 background-color: rgba(0%, 50%, 100%, 0.5); 33 /* 34 a very lite blue color 35 according to 36 https://www.colorhexa.com/7fbfff 37 */ 38 color: yellow; 39 } 40 </style> 41 42 <p>PREREQUISITE: User agent needs to have an enabled and capable grammar error module. If it does not, then this test does not apply to such user agent. 43 44 <p>Test passes 45 46 <ul> 47 <li>if each glyph of the sentence is yellow 48 <li>if "thing" has a desaturated lime green background 49 <li>if the other words have a very lite blue background and 50 <li>if there is no red. 51 </ul> 52 53 <div id="ref" class="highlight_reftest"> 54 <div id="grammar-error">Many <span>thing</span> can happen.</div> 55 <div id="selection"><span>Many thing can happen.</span></div> 56 Many thing can happen. 57 </div>