Friday, 18 January 2013

<PRE> tags and white-space: pre style

When you need to preserve tab characters and line breaks within HTML elements other than multiline input fields, you can use the <pre> tag or the style attribute of white-space: pre.

Just noticed that there is a slight difference in using a <pre> tag and a div with the white-space: pre style attribute applied to it. As the default user agent setting for the font-family style attribute for a <pre> tag is mono

clip_image001

Found more of a description on this site... http://www.quirksmode.org/css/whitespace.html#t01

clip_image002

Use Plunkr to test it out if you like....

http://plnkr.co/edit/dqJKnD?p=preview

<!DOCTYPE html>
<html>

  <head lang="en">
    <meta charset="utf-8">
    <title>Awesome Game</title>
  <head>
 
  <body>
  <pre>Test this wer awereaw
   
    waerwearaw
    waeraw
    w
   
  </pre>
  <div id='content' style="white-space:pre">Content!
   
    waer
   
    weraweraw
    waera
    waer
  </div>
   
  </body>
 
</html>

No comments:

Post a Comment

How to by pass the Jaguary X-Type enter security pin screen after changing battery

How to bypass security code on Jaguar X-Type touchscreen Satellite Navigational units. Just hold the skip track, AMEM and PTY buttons ...