0

I've looked through several questions and forums and have been unable to find an answer. I saw this post, but it's solution didn't work for me.

I can confirm this problem is happening for me on both windows and mac Firefox.

div {
  width: 200px;
  padding: 0 15px;
  margin: 0 auto;
}
p {
  font-size: 16px;
  -ms-word-break: break-all;
  word-break: break-all;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}
<div>
  <p lang="en">Better Life Expands Commitment to the Environment
</div>

For me, in Chrome is breaks the word "Commitment" to two lines "Commit-ment" with a hyphen. Firefox it cuts the word into "Commitme" and "nt", but fails to enter a hyphen.

I've tried all lowercase, various sizes, inserting &shy; and using manual, but nothing seems to work. Have I missed something that would lead to a solution?

bad_coder
  • 11,289
  • 20
  • 44
  • 72
Kyle Hawk
  • 429
  • 4
  • 16

1 Answers1

1

Just erase the word-break: break-all; - works here in Firefox:

div {
  width: 200px;
  padding: 0 15px;
  margin: 0 auto;
}

p {
  font-size: 16px;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}
<div>
  <p lang="en">Better Life Expands Commitment to the Environment
</div>

Here's a screenshot of the result (Firefox Mac):

enter image description here

Johannes
  • 64,305
  • 18
  • 73
  • 130
  • @moped This is actually the solution I was looking for, I apologize for any confusion. Basically, I want a word to wrap to the next line with a hyphen, which this solution solves. Out of all the combinations I've tried, I never thought to remove word-break...Thank you!!! – Kyle Hawk Apr 19 '17 at 14:22
  • OK, I assumed she wants those words with hyphens, sorry .. anyways, strangely it doesn't work in Edge, Vivaldi 1.8, Chrome :/ – moped Apr 19 '17 at 14:22
  • Interesting. For me it is working in Chrome(57) and FireFix(52), but on IE11 it wraps the word instead of breaking it, which honestly is fine for my purpose. I am unable to test in edge at the moment, working on Mac with a windows 7 VM. – Kyle Hawk Apr 19 '17 at 14:25