Method of breaking a long line sentence

Question

I'm developing an iPhone theme for my website, can you be able to break a long sentence something like this:

A long sentence would go past the iPhone screen and I need this to break

Into this:

A long sentence would go past the iPhone
screen and I need this to break

Showing like this:

http://uimgz.com/i/M8U5X5f2d1.png

Answer 1

As per: https://developer.mozilla.org/en-US/docs/Web/CSS/white-space#Browser_compatibility

pre {
  word-wrap: break-word;      /* IE 5.5-7 */
  white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
  white-space: pre-wrap;      /* current browsers */
}

word-wrap doesn't seem to work any more, use white-space instead

Answer 2

if your text has spaces then adding a width for the wrap element will break the text automatically. But if you have a text without a space (such as a link) you can use break-word:

.your-selector {
  word-wrap: break-word;
}

Answer 3

I think the problem is that the "viewport" is wider than the device's screen. See this post for some background and possible solution.