1

I am using topcoat css on a cordova mobile app. I want pre-text to fit within width and not word-wrap.

http://codepen.io/civilwar/pen/JEebd

I have text that I want to keep the return characters between paragraphs. I do not want to keep the width of the text. To get around this issue I have my pre text to be in a div that has word wrap break word. This converts the text to only appear within the width of the mobile app ( i.e. I don't have to scroll to the right). Getting rid of word wrap break word makes the pre text go out to its original width. I want to disable word wrap but keep my pre-text within the width of the app how do I do that?

Aamir Shahzad
  • 6,683
  • 8
  • 47
  • 70
Charles Morrison
  • 418
  • 1
  • 4
  • 23

1 Answers1

1

Working Demo

Just this CSS

.summary > pre {
    white-space: normal;
}

good luck!

Aamir Shahzad
  • 6,683
  • 8
  • 47
  • 70
  • 1
    this fixes the width but removes the spacing between paragraphs. I want to keep the spacing between paragraphs – Charles Morrison Jun 21 '14 at 20:04
  • @user1795480 just add line-height: 25px; or whatever you want. Perhaps this was not part of the question. – Aamir Shahzad Jun 21 '14 at 20:07
  • close enough I just had all my text convert return lines to
    – Charles Morrison Jun 21 '14 at 20:23
  • @user1795480
    is not recommended solution each time you add new text you have to add a
    . Suppose you have a dynamic text then adding
    seems not right to me. see this post http://stackoverflow.com/questions/1726073/is-it-sometimes-bad-to-use-br     – Aamir Shahzad Jun 22 '14 at 06:41