third_party/WebKit/LayoutTests/fast/text/hyphenate-character.html

   1 <style>
   2     .text-box {
   3         border: solid;
   4         padding: 4px;
   5         width: 110px;
   6         font-size: 18px;
   7         text-align: justify;
   8     }
   9
  10     .hyphenate-character-auto {
  11         -webkit-hyphenate-character: auto;
  12     }
  13
  14     .hyphenate-character-bullet {
  15         -webkit-hyphenate-character: "\2022";
  16     }
  17
  18     .hyphenate-character-tilde-dot {
  19         -webkit-hyphenate-character: "\B7~";
  20     }
  21
  22     .test {
  23         float: left;
  24         margin: 0 4px;
  25     }
  26 </style>
  27 <div class="test">
  28     <p>The initial value (should be like <tt>auto</tt>)</p>
  29     <div class="text-box">
  30       antidisestab&shy;lishment&shy;arianism
  31     </div>
  32 </div>
  33 <div class="test">
  34     <p>The default (<tt>hyphenate-character: auto</tt>)</p>
  35     <div class="text-box hyphenate-character-auto">
  36       antidisestab&shy;lishment&shy;arianism
  37     </div>
  38 </div>
  39 <div class="test">
  40     <p>Bullet (<tt>hyphenate-character: "\2022"</tt>)</p>
  41     <div class="text-box hyphenate-character-bullet">
  42       antidisestab&shy;lishment&shy;arianism
  43     </div>
  44 </div>
  45 <div class="test">
  46     <p>Middle dot and tilde (<tt>hyphenate-character: "\B7~"</tt>)</p>
  47     <div class="text-box hyphenate-character-tilde-dot">
  48       antidisestab&shy;lishment&shy;arianism
  49     </div>
  50 </div>