HTML <dir> Element

HTML <dir> Element

The <dir> element was historically used to create a directory-style list of short items, such as filenames or other compact entries. It was similar to an unordered list and contained individual items marked up with the <li> element.

Historical Syntax

Older HTML documents may contain markup similar to the following:

<dir>
  <li>index.html</li>
  <li>about.html</li>
  <li>contact.html</li>
</dir>

In supporting browsers, the contents were displayed as a list similar to an unordered list. This code is shown for historical reference only and should not be used in modern HTML.

Attributes

The <dir> element historically supported the compact attribute, which indicated that the browser should display the directory list in a more compact form. The attribute was presentational and is obsolete along with the element.

Historical Use

The <dir> element was intended for short directory-style lists. A typical use was displaying filenames or similarly brief entries rather than longer descriptive list items.

Each entry was represented by an <li> element. Although the element had a distinct name and historical purpose, its practical behavior was very similar to the <ul> element used for ordinary unordered lists.

Why It Became Obsolete

The <dir> element provided little that could not already be accomplished with the more general <ul> element. Maintaining separate HTML elements for two forms of essentially the same unordered list was unnecessary.

Its compact presentation was also better handled with CSS, which allows list spacing, markers, columns, and other visual characteristics to be controlled without changing the meaning of the HTML. The <dir> element was deprecated in HTML 4 and is obsolete in modern HTML.

Modern Alternative

Use the <ul> element with <li> elements for an unordered list. CSS can then be used if a compact or directory-like presentation is desired.

<ul class="file-list">
  <li>index.html</li>
  <li>about.html</li>
  <li>contact.html</li>
</ul>

.file-list {
  margin: 0;
  padding-left: 20px;
}

.file-list li {
  margin-bottom: 4px;
}

Legacy Browser Support

Modern browsers may still recognize the <dir> element and display its contents similarly to an unordered list for compatibility with older webpages. Historical presentation details, including the obsolete compact attribute, should not be relied upon.

This legacy browser behavior does not make <dir> valid modern HTML. Existing <dir> elements should be replaced with <ul> when older HTML is updated.

For detailed legacy browser compatibility information, see Can I Use: HTML <dir> Element .

Related Elements

Use the <ul> element for an unordered list in modern HTML. Individual list entries are represented by the <li> element.

Specifications

The <dir> element is listed as an entirely obsolete, non-conforming feature in the WHATWG HTML Living Standard . Authors should use <ul> instead.