HTML <pre> tag

The <pre> tag is used to define preformatted texts. It preserves space, line space and line breaks as exactly written.

Type: Block Element

Syntax of <pre> tag

<pre>
  preformatted texts
</pre>

Full code example

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<!-- With <pre> tag -->
<pre>
  This is first line.
    This is second line.
  This is   third line.
</pre>

<!-- With <p> tag -->
<p>
  This is first line.
    This is second line.
  This is   third line.
</p>
</body>
</html>
Run The code »

Output on the browser

  This is first line.
    This is second line.
  This is   third line.
This is first line. This is second line. This is third line.

<pre> element preserves both line spaces and line breaks. It is mostly used to display some sorts of code in tutorial sites, any unusual texts and in writing poems.

Supported Browsers

Tag Chrome Internet Explorer Firefox Safari Opera Mini
<pre> Yes Yes Yes Yes Yes

Attribute of <pre> tag

Attribute Value Note
width number It specifies the maximum number of character per line.

The width attribute is obsolete in HTML5 and completely replaced by CSS.

Example of using width attribute (outdated)

<pre width="20">
This is a preformatted text block with a limited line width.
</pre>

<pre width="40">
This is a wider preformatted text block showing more characters per line.
</pre>

Modern CSS replacement

<pre style="max-width: 400px; white-space: pre-wrap;">
The lengthoi
</pre>

Default CSS properties of <pre> tag

pre {
 font-family: monospace;
 display: block;
 white-space: pre;
 margin: 1em 0;
}