The HTML <main> element represents the main content of the <body> of a document or application. The main content area consists of content that is directly related to, or expands upon the central topic of, a document or the central functionality of an application.
| Content categories | Flow content, palpable content. |
|---|---|
| Permitted content | Flow content. |
| Tag omission | None; both the starting and ending tags are mandatory. |
| Permitted parents | Any element that accepts flow content other than <article>, <aside>, <footer>, <header>, or <nav>. |
| Permitted ARIA roles | None |
| DOM interface | HTMLElement |
Attributes
This element only includes the global attributes.
Usage notes
While the WHATWG living standard for HTML allows multiple <main> elements in a page, the W3C version of the specification does not. In addition, the W3C version of the HTML specification doesn't allow <main> as a descendant of <article>, <aside>, <footer>, <header>, or <nav>.
The content of a <main> element should be unique to the document, excluding any content that is repeated across a set of documents such as sidebars, navigation links, copyright information, site logos, and search forms (unless the document's main function is as a search form).
Example
<!-- other content -->
<main>
<h1>Apples</h1>
<p>The apple is the pomaceous fruit of the apple tree.</p>
<article>
<h2>Red Delicious</h2>
<p>These bright red apples are the most common found in many
supermarkets.</p>
<p>... </p>
<p>... </p>
</article>
<article>
<h2>Granny Smith</h2>
<p>These juicy, green apples make a great filling for
apple pies.</p>
<p>... </p>
<p>... </p>
</article>
</main>
<!-- other content -->
Specifications
| Specification | Status | Comment |
|---|---|---|
| WHATWG HTML Living Standard The definition of '<main>' in that specification. |
Living Standard | Removed the restriction about using <main> multiple times in a document, or as a descendent of an <article> element. |
| HTML 5.1 The definition of '<main>' in that specification. |
Recommendation | No change from HTML5. |
| HTML5 The definition of '<main>' in that specification. |
Recommendation | Initial definition. |
Browser compatibility
The <main> element is widely supported. For Internet Explorer 11 and below, it is suggested that an aria role of "main" be added to the <main> element to ensure it is accessible (screen readers like JAWS, used in combination with older versions of Internet Explorer, will be able to understand the semantic meaning of the <main> element once this role attribute is included).
<main role="main"> ... </main>
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | Chrome 26 | 21.0 (21.0) | 12 | Opera 16 | Safari 7 |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | 4.4 | 21.0 (21.0) | No support | No support | 7.1 |