1

I have the following code which I'm trying to test on how to use pre format on my site. After including the pre , the font changes and the lines does not break to fit on the 200px division . I want to maintain the default font size, style and family. NB: I don't want to use overflow method . I would like to have an output like this

"Sometimes it is very hard to code but by
 circumstance you find yourself struggling 
to fit in the game .
Awesome feelings come and disappear.
Niggas say this game is for the patient hearts.
 You nigga is this true??
  Nigga love style
 keep in touch with us at any given time"

plus the default text font 

<html>
    <head>
       <title>Test</title>
    <style>
    {
      pre{
    font-family: monospace;
    text-wrap: unrestricted;
    }
    }
    </style>
    </head>
    <body>
    <div style='width:200px;'>
      <pre>Sometimes it is very hard to code but by circumstance you find yourself struggling to fit in the game .Awesome feelings come and disappear.Niggas say this game is for the patient hesrts .. You nigga is this true??
    Nigga love style
    keep in touch with us at any given time</pre>
    </body>
    </html>

please help me solve this problem

x tech
  • 53
  • 7
  • What are you wanting the pre tag for? Have you tried changing the font-family from monospace to something else? – kojow7 Nov 15 '15 at 06:05

2 Answers2

5

Remove the <pre> element and just add the style to the CSS as follows:

<div style='width:200px; white-space: pre-wrap;'>
      Your text here
</div>
kojow7
  • 10,308
  • 17
  • 80
  • 135
  • Also: try to use HTML tags according to their semantic meaning. You seem to use the given structure only for design purposes (so: no semantic meaning), therefore, a div (or span sometimes) is the way to go. On the semantic meaning of pre: http://www.sitepoint.com/everything-need-know-html-pre-element/ – Stefan Dochow Nov 15 '15 at 06:17
5

Would this solution fit your need? <div style="white-space: pre-wrap;">content</div>

I've seen that here link

Community
  • 1
  • 1