| OLD | NEW |
| 1 <style> | 1 <style> |
| 2 html { | |
| 3 -webkit-locale: "en_US"; | |
| 4 } | |
| 5 | |
| 6 .text-box { | 2 .text-box { |
| 7 border: solid; | 3 border: solid; |
| 8 padding: 4px; | 4 padding: 4px; |
| 9 width: 330px; | 5 width: 110px; |
| 10 font-size: 18px; | 6 font-size: 18px; |
| 11 text-align: justify; | 7 text-align: justify; |
| 12 -webkit-hyphens: auto; | |
| 13 } | |
| 14 | |
| 15 .float { | |
| 16 width: 75px; | |
| 17 height: 5em; | |
| 18 background-color: aliceblue; | |
| 19 float: right; | |
| 20 margin-left: 10px; | |
| 21 } | 8 } |
| 22 | 9 |
| 23 .hyphenate-character-auto { | 10 .hyphenate-character-auto { |
| 24 -webkit-hyphenate-character: auto; | 11 -webkit-hyphenate-character: auto; |
| 25 } | 12 } |
| 26 | 13 |
| 27 .hyphenate-character-bullet { | 14 .hyphenate-character-bullet { |
| 28 -webkit-hyphenate-character: "\2022"; | 15 -webkit-hyphenate-character: "\2022"; |
| 29 } | 16 } |
| 30 | 17 |
| 31 .hyphenate-character-tilde-dot { | 18 .hyphenate-character-tilde-dot { |
| 32 -webkit-hyphenate-character: "\B7~"; | 19 -webkit-hyphenate-character: "\B7~"; |
| 33 } | 20 } |
| 34 | 21 |
| 35 .test { | 22 .test { |
| 36 float: left; | 23 float: left; |
| 37 margin: 0 4px; | 24 margin: 0 4px; |
| 38 } | 25 } |
| 39 </style> | 26 </style> |
| 40 <div class="test"> | 27 <div class="test"> |
| 41 <p>The initial value (should be like <tt>auto</tt>)</p> | 28 <p>The initial value (should be like <tt>auto</tt>)</p> |
| 42 <div class="text-box"> | 29 <div class="text-box"> |
| 43 <div class="float"></div> | 30 antidisestab­lishment­arianism |
| 44 The chief difficulty Alice found at first was in managing her | |
| 45 flamingo: she succeeded in getting its body tucked away, | |
| 46 comfortably enough, under her arm, with its legs hanging down, | |
| 47 but generally, just as she had got its neck nicely straightened | |
| 48 out, and was going to give the hedgehog a blow with its head, it | |
| 49 would twist itself round and look up in her face… | |
| 50 </div> | 31 </div> |
| 51 </div> | 32 </div> |
| 52 <div class="test"> | 33 <div class="test"> |
| 53 <p>The default (<tt>hyphenate-character: auto</tt>)</p> | 34 <p>The default (<tt>hyphenate-character: auto</tt>)</p> |
| 54 <div class="text-box hyphenate-character-auto"> | 35 <div class="text-box hyphenate-character-auto"> |
| 55 <div class="float"></div> | 36 antidisestab­lishment­arianism |
| 56 The chief difficulty Alice found at first was in managing her | |
| 57 flamingo: she succeeded in getting its body tucked away, | |
| 58 comfortably enough, under her arm, with its legs hanging down, | |
| 59 but generally, just as she had got its neck nicely straightened | |
| 60 out, and was going to give the hedgehog a blow with its head, it | |
| 61 would twist itself round and look up in her face… | |
| 62 </div> | 37 </div> |
| 63 </div> | 38 </div> |
| 64 <div class="test"> | 39 <div class="test"> |
| 65 <p>Bullet (<tt>hyphenate-character: "\2022"</tt>)</p> | 40 <p>Bullet (<tt>hyphenate-character: "\2022"</tt>)</p> |
| 66 <div class="text-box hyphenate-character-bullet"> | 41 <div class="text-box hyphenate-character-bullet"> |
| 67 <div class="float"></div> | 42 antidisestab­lishment­arianism |
| 68 The chief difficulty Alice found at first was in managing her | |
| 69 flamingo: she succeeded in getting its body tucked away, | |
| 70 comfortably enough, under her arm, with its legs hanging down, | |
| 71 but generally, just as she had got its neck nicely straightened | |
| 72 out, and was going to give the hedgehog a blow with its head, it | |
| 73 would twist itself round and look up in her face… | |
| 74 </div> | 43 </div> |
| 75 </div> | 44 </div> |
| 76 <div class="test"> | 45 <div class="test"> |
| 77 <p>Middle dot and tilde (<tt>hyphenate-character: "\B7~"</tt>)</p> | 46 <p>Middle dot and tilde (<tt>hyphenate-character: "\B7~"</tt>)</p> |
| 78 <div class="text-box hyphenate-character-tilde-dot"> | 47 <div class="text-box hyphenate-character-tilde-dot"> |
| 79 <div class="float"></div> | 48 antidisestab­lishment­arianism |
| 80 The chief difficulty Alice found at first was in managing her | |
| 81 flamingo: she succeeded in getting its body tucked away, | |
| 82 comfortably enough, under her arm, with its legs hanging down, | |
| 83 but generally, just as she had got its neck nicely straightened | |
| 84 out, and was going to give the hedgehog a blow with its head, it | |
| 85 would twist itself round and look up in her face… | |
| 86 </div> | 49 </div> |
| 87 </div> | 50 </div> |
| OLD | NEW |