Two column layout
Replace the <div class="content-container"> child of the
<main> element with a
<div class="two-column-container">
NOTE: Here, in the example, we have the layout INSIDE of another layout. Make sure not to do this; This is only for the documentation
Sidebar Content
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias dignissimos repudiandae, itaque at quam, quaerat iusto facilis laudantium reprehenderit soluta iure mollitia error vero porro aliquid minima consequuntur perferendis? Corporis!
Main Content
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias dignissimos repudiandae, itaque at quam, quaerat iusto facilis laudantium reprehenderit soluta iure mollitia error vero porro aliquid minima consequuntur perferendis? Corporis!
<div class="two-column-container">
<div class="column">
<h3>Sidebar Content</h3>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias
dignissimos repudiandae, itaque at quam, quaerat iusto facilis laudantium
reprehenderit soluta iure mollitia error vero porro aliquid minima
consequuntur perferendis? Corporis!
</p>
</div>
<div class="column">
<h2>Main Content</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias
dignissimos repudiandae, itaque at quam, quaerat iusto facilis laudantium
reprehenderit soluta iure mollitia error vero porro aliquid minima
consequuntur perferendis? Corporis!
</p>
</div>
</div>