-3

I am facing a problem in word-wrapping the text in using the suggested word-wrap:break-word style, as it is not replicated in FF and others,

I have also refered the below Question as it is the same as mine, but didnt found it helpful in any way

Old Question

So can any body help me up to achieve this?

Thanks

Community
  • 1
  • 1
OM The Eternity
  • 15,694
  • 44
  • 120
  • 182
  • 1
    What exactly did you find not helpful in the other question? – Pekka Dec 06 '11 at 10:17
  • 1
    *"I have also refered the below Question as it is the same as mine, but didnt found it helpful in any way"* Perhaps, like the author of that question, you could say *why* you didn't find the techniques discussed there helpful, particularly the one described in [the most up-voted answer](http://stackoverflow.com/a/322991/157247). – T.J. Crowder Dec 06 '11 at 10:19
  • @T.J. Crowder Being Most upvoted is not the best We need always. Finally it should work, and it is not working i.e. word-wrap:break-word style – OM The Eternity Dec 06 '11 at 10:22
  • 1
    @OMTheEternity: Until/unless you quote your markup and styling, describe the result you expect, and describe what you're seeing instead (e.g., Asking Technical Questions 101), your question cannot be answered. – T.J. Crowder Dec 06 '11 at 10:29

2 Answers2

3

word-wrap:break-word is supported in Firefox, from version 3.5 onwards, Opera from 10.5, Safari from 2, Chrome from 1, and IE from at least 6. See:

Failing that, I’ve sometimes resorted to inserting a content-less <span> with display:inline-block in the places where I want the string to break. That works in Firefox 3.0, although not in earlier versions of Firefox because they don’t support display:inline-block.

Paul D. Waite
  • 96,640
  • 56
  • 199
  • 270
  • 1
    @OMTheEternity: What is the result you're seeing that makes you think it isn't working? – T.J. Crowder Dec 06 '11 at 10:21
  • @OMTheEternity: I tried it too, and `word-wrap:break-word` *is* supported in the browsers I’ve stated. See http://jsfiddle.net/fBMdy/. Maybe you could post the code showing what you’re trying to wrap? – Paul D. Waite Dec 06 '11 at 10:25
  • 1
    @OMTheEternity: Paul's not the only one who thinks it works: http://caniuse.com/#search=word-wrap Here's a more thorough example: http://jsbin.com/arodil – T.J. Crowder Dec 06 '11 at 10:35
  • Thanks Paul and T. J. Crowder, It worked but by the way Pieter Told me so. – OM The Eternity Dec 06 '11 at 10:44
  • @OMTheEternity: it’d be nice to know what wasn’t working in the first place, but I’m glad you got your issue solved. – Paul D. Waite Dec 06 '11 at 11:08
2

If you specify the desired width and set height: auto; you should get the desired line-wrapping in all modern browsers.

EDIT: white-space: normal; wasn't really necessary, and I should note that the solution wraps lines, not individual words.

Pieter
  • 3,339
  • 5
  • 30
  • 63
  • 1
    How does that cause breaking *within* words when necessary? I'm not getting it: http://jsbin.com/arodil – T.J. Crowder Dec 06 '11 at 10:36
  • It worked for me, but how did setting width and height: auto; white-space: normal; supported it? – OM The Eternity Dec 06 '11 at 10:43
  • Pieter, did you mean those styles *in addition to* `word-wrap: break-word;`? – T.J. Crowder Dec 06 '11 at 10:45
  • I don't believe this would support breaking inside words. Just breaking lines. – Pieter Dec 06 '11 at 10:53
  • Pieter, the question clearly talks about breaking *within words*. But in any case, somehow whatever @OMTheEternity's problem was (since he/she *still hasn't told us*), this fixed it. – T.J. Crowder Dec 06 '11 at 11:06
  • 1
    @Pieter: out of interest, why do you have to set `white-space: normal`? Isn’t that [the default value](http://www.w3.org/TR/CSS1/#white-space)? – Paul D. Waite Dec 06 '11 at 11:07
  • @Paul: I copy-n-pasted the solution from CSS I had lying around. It seems that I had overridden white-space somewhere else and set it back to default for this word-wrap issue. So it should work without it as well I guess. – Pieter Dec 06 '11 at 12:15