0

When I'm using font-face I have a word-break problem, with tense which include dashes.

With the standard font, everything works well. HTML (This is Georgian language)

<p>მობილური აპლიკაცია Sმარტივი-ს მომხმარებლებისათვის</p>

Here is computed css:

  box-sizing: border-box;
  color: rgb(51, 51, 51);
  cursor: pointer;
  display: block;
  font-family: lb-default;
  font-size: 13px;
  height: 36px;
  line-height: 18.5714092254639px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  width: 184.5px;

P.S. Text is inside of bootstrap grid cell.

j08691
  • 204,283
  • 31
  • 260
  • 272
Lasharela
  • 1,307
  • 1
  • 11
  • 23
  • Do you want to text to stop getting hyphens on one line, or you want to remove hyphens completely? Or something else? – Lynel Hudson Apr 03 '15 at 16:37

2 Answers2

0

First set the lang attribute on the html tag, then use:

-moz-hyphens: none;
-ms-hyphens: none;
-webkit-hyphens: none;
 hyphens: none;
Lynel Hudson
  • 2,335
  • 1
  • 18
  • 34
  • For some reason it looks like chrome stopped supporting this even with the prefix: http://caniuse.com/#search=hyp. Whats strange is CSS tricks shows the prefix once working: https://css-tricks.com/almanac/properties/h/hyphenate/ – Lynel Hudson Apr 03 '15 at 16:41
  • @Lasharela Try setting the `lang` attribute on the `html` tag. – Lynel Hudson Apr 03 '15 at 16:43
  • I've found "Georgian's" ISO for lang attribute (http://www.w3schools.com/tags/ref_language_codes.asp) but that doesn't work. Also chrome doesn't recognize: `hyphens: none; -webkit-hyphens: none;` – Lasharela Apr 03 '15 at 16:50
0

I've just found partial solution:

You can use a Unicode NON-BREAKING HYPHEN (U+2011): ‑. HTML entity:

&#8209;

How to prevent line break at hyphens on all browsers

Community
  • 1
  • 1
Lasharela
  • 1,307
  • 1
  • 11
  • 23