index.md

---

title: '<aside>: The Aside element'
slug: Web/HTML/Element/aside
page-type: html-element
browser-compat: html.elements.aside

---

{{HTMLSidebar}}

The <aside> HTML element represents a portion of a document whose content is only indirectly related to the document's main content. Asides are frequently presented as sidebars or call-out boxes.

{{EmbedInteractiveExample("pages/tabbed/aside.html", "tabbed-standard")}}

Attributes

This element only includes the global attributes.

Usage notes

• Do not use the <aside> element to tag parenthesized text, as this kind of text is considered part of the main flow.

Examples

Using <aside>

This example uses <aside> to mark up a paragraph in an article. The paragraph is only indirectly related to the main article content:

<article>
  <p>
    The Disney movie <cite>The Little Mermaid</cite> was first released to
    theatres in 1989.
  </p>
  <aside>
    <p>The movie earned $87 million during its initial release.</p>
  </aside>
  <p>More info about the movie…</p>
</article>

{{EmbedLiveSample("Using_aside")}}

Technical summary

Content categories	Flow content, sectioning content, palpable content.
Permitted content	Flow content.
Tag omission	{{no_tag_omission}}
Permitted parents	Any element that accepts flow content. Note that an <aside> element must not be a descendant of an {{HTMLElement("address")}} element.
Implicit ARIA role	complementary
Permitted ARIA roles	feed, none, note, presentation, region, search
DOM interface	{{domxref("HTMLElement")}}

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also

• Other section-related elements: {{HTMLElement("body")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}}, {{HTMLElement("Heading_Elements", "h1")}}, {{HTMLElement("Heading_Elements", "h2")}}, {{HTMLElement("Heading_Elements", "h3")}}, {{HTMLElement("Heading_Elements", "h4")}}, {{HTMLElement("Heading_Elements", "h5")}}, {{HTMLElement("Heading_Elements", "h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("address")}};

• Using HTML sections and outlines

• ARIA: Complementary role