title: Retain newlines in HTML but wrap text: possible?
body: <p>I came across an interesting problem today.  I have a text email I'm sending from a Web page.  I'm displaying a preview and wanted to put the preview in a fixed font retaining the white space since that's the way the plain text email will appear.</p>
  
  <p>Basically I want something that'll act like Notepad: the newlines will signal a newline but the text will otherwise wrap to fit inside it's container.</p>
  
  <p>Unfortunately this is proving difficult unless I'm missing something really obvious.  I've tried:</p>
  
  <ol>
  <li><p>CSS <code>white-space: pre</code>.  This retains white space but doesn't wrap lines of text so they go out the borders on long lines;</p></li>
  <li><p>Styling a textarea element to be read only with no border so it basically apepars like a <code>div</code>.  The problem here is that IE doesn't like 100% heights on textareas in strict mode.  Bizarrely it's OK with them in quirks mode but that's not an option for me.</p></li>
  <li><p>CSS <code>white-space: prewrap</code>.  This is CSS 2.1 so probably not widely supported (I'm happy if it's supported in IE7 and FF3 though; I don't care about IE6 for this as its an admin function and no one will be running IE6 that will use this page).</p></li>
  </ol>
  
  <p>Any other suggestions?  Can this really be that hard?</p>
  
  <p>edit: can't comment so more info.  Yes at the moment I am using font Courier New (i.e. fixed width) and using a regex on the server side to replace the newlines with <code>&lt;br&gt;</code> tags but now I need to edit the content and it just strikes me as awkward that you need to strip out and add the <code>&lt;br&gt;</code>s to make it work.</p>
  
  <p>is there no better way?</p>