HTML aside Tag

Last Updated : 11 Jul, 2025

The <aside> tag is used to describe the main object of the web page more shortly like a highlighter. It identifies the content that is related to the primary content of the web page but does not constitute the main intent of the primary page. The <aside> tag contains mainly author information, links, related content, and so on.

Note: The <aside> tag supports Global attributes and Event attributes in HTML. The <aside> tag is new in HTML5. This tag does not render anything special in a browser you have to use CSS for that.

HTML

<!DOCTYPE html>
<html>

<body>
    <article>
        <h2>Learning HTML</h2>
        <p>
          HTML is the standard markup language for creating web pages.
      	</p>
        <aside>
            <h3>Did You Know?</h3>
            <p>
              HTML stands for HyperText Markup Language.
          	</p>
        </aside>
        <p>
          It is easy to learn and widely used in web development.
      	</p>
    </article>
</body>

</html>

Key Points:

Placement: The <aside> tag is often placed
- In a sidebar of a webpage.
- Inside an <article> tag for content that provides additional context (e.g., a glossary, quote, or related links).
Common Use Cases:
- Sidebars with links to related content.
- Advertisements or promotions.
- Brief author bios or quotes.

Aside tag use as sidebar

HTML

<!DOCTYPE html>
<html>

<head>
    <style>
        article {
            width: 50%;
            padding: 10px;
            float: left;
        }

        aside {
            width: 40%;
            float: right;
            background-color: green;
            color: white;
            padding: 5px;
            margin: 10px;
            height: 100px;
        }
    </style>
</head>

<body>
    <article>
        <h1>Heading . . .</h1>

        <p>
            Aside tag is use to display important
            information about the primary page.
        </p>

    </article>
  
    <aside>
        <h1>Aside tag example</h1>

        <p>Aside tag content. . .</p>

    </aside>
</body>

</html>