In this article
The <aside> tag is used to define secondary or complementary content related to the main content of the page.
This content is often presented as side panels (like menus, for example 😉), informational boxes, or advertisements, but it can also include appendices like sources or definitions in an article.
Good to know
This is one of the new tags introduced with HTML5!
Â
Structure and syntax of the <aside> tag
HTML
<aside>
<!-- Complementary content -->
</aside>Â
Examples of usage
Defining author information
HTML
<aside>
<h3>About the author</h3>
<p>Believemy trains over 10,000 developers annually to become freelancers.</p>
</aside>Â
Defining related articles
HTML
<main>
<article>
<h1>React vs Next.js</h1>
<p>React and Next.js are two essential technologies in modern web development...</p>
</article>
<aside>
<h3>Related Articles</h3>
<ul>
<li><a href="https://believemy.com/r/les-nouveautes-de-nextjs-15">Learn all about NextJS 15</a></li>
<li><a href="https://believemy.com/r/les-nouveautes-de-react-19">Learn all about React 19</a></li>
</ul>
</aside>
</main>Â
Attributes
The <aside> tag does not have specific attributes, but it supports all global HTML attributes.
| Attribute | Description | Possible value |
|---|---|---|
id | Unique identifier to target the element. | Unique text. |
class | CSS class(es) to style the content. | Space-separated list of classes. |
style | Inline CSS styling. | CSS declarations. |
hidden | Hides the element from users. | None or hidden. |
lang | Specifies the language used in the box. | Language code (fr, en, etc.). |
Â
Browser compatibility
The <aside> tag is compatible with all browsers (except Internet Explorer 11, as it is an HTML5 tag).
| Element | Google Chrome | Safari | Mozilla Firefox | Edge |
| <aside> | Yes | Yes | Yes | Yes |