Sidebar

To add a sidebar to your site, use the <aside> tag to create a sidebar. You must wrap the rest of your body code in a <main> tag. To put the sidebar on the left, write code like such:

<aside>
  <h3>
    Navigation
  </h3>
</aside>
<main>
  <h1>
    Hi!
  </h1>
</main>

A right-positioned sidebar can also be created by putting the sidebar code after the <main> element, which is ideal for placing embedded information.

<main>
  <h1>
    Hi!
  </h1>
</main>
<aside>
  <h2>
    Embed
  </h2>
</aside>

Warning

You can't use two sidebars at once, and non-sidebar code must be wrapped in a <main> tag.

Support Chrome Safari Firefox Edge Opera
<aside> 5+ 5+ 4+ 12+ 11.5+
<main> 26+ 7+ 21+ 12+ 16+

Information for this support table comes from Can I Use.