"Free ▼" split into two words in Chrome

I have a div with text-align: justifythat contains several words scattered to fill the div, one of which is "Free ▼". In Mozilla, "Free ▼" is printed as one word, but in Chrome it is split into two different words, as shown in this fiddle: ( http://jsfiddle.net/806hjj7a/ ).

Does anyone know how I can make strings containing special characters print as one word?

<div class="justify">
  Lorem ipsum Ullamco quis ut Free▼
</div>

---

.justify {
  text-align: justify;
}
.justify:after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 0;
  line-height: 0;
}
+4
source share
1 answer

Wrap them in a range of s display: inline-blockand text-alignas needed (right or left)

http://jsfiddle.net/806hjj7a/1/

+4
source

All Articles