1 <html> 2 <head> 3 4 <style> 5 .editing { 6 border: 2px solid red; 7 padding: 12px; 8 font-size: 24px; 9 } 10 .inputtest { 11 font-family:'Hiragino Kaku Gothic Std'; 12 border: 2px solid green; 13 } 14 </style> 15 16 <title>Inline Input Method Marking</title> 17 </head> 18 <body> 19 <p>This tests that the underlining of the inline input hole does not obscure the glyphs.</p> 20 21 <ol> 22 <li>Switch to Hirigana input method</li> 23 <li>Type characters into each of the green blocks below</li> 24 <li>As you do so, check that glyphs in the inline hole are clearly readable</li> 25 </ol> 26 <div contenteditable id="root" class="editing" style="width:400px;"> 27 9px Hiragino Kaku Gothic Std<div class="inputtest" style="font-size: 9px;"><br></div> 28 <br>12px Hiragino Kaku Gothic Std<div class="inputtest" style="font-size: 12px;"><br></div> 29 <br>24px Hiragino Kaku Gothic Std<div class="inputtest" style="font-size: 24px;"><br></div> 30 </div> 31 32 <script> 33 runEditingTest(); 34 </script> 35 36 </body> 37 </html> 38 39