Astro

← Astro Home

Basic Left

A left-aligned navigation and logo.

Simple Version

If you're using the simple version, remove the content under @media (max-width: 40em) from the stylesheet.

<nav class="nav-wrap">
    <a class="logo" href="#">My Brand</a>
    <ul class="nav">
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
    </ul>
</nav>

Collapse-and-Expand Option

If you're using the expand-and-collapse option, be sure to include astro.js and jQuery.

<nav class="nav-wrap">
    <a class="logo" href="#">My Brand</a>
    <a class="nav-toggle" data-target="#nav-menu" href="#">Menu ▼</a>
    <div class="nav-collapse" id="nav-menu">
        <ul class="nav">
            <li><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
        </ul>
    </div>
</nav>