<div class="uk-section uk-height-viewport uk-flex uk-flex-middle">
    <div class="uk-container uk-width-3-4@xl">

        <div class="uk-child-width-1-3@m uk-grid-large" uk-grid>

            <div>
                <h2 class="uk-h5 uk-heading-divider uk-margin-medium">Default</h2>
                <ul class="uk-subnav" uk-margin>
                    <li class="uk-active"><a href="#">Active</a></li>
                    <li><a href="#">Item</a></li>
                    <li><a href="#">Item</a></li>
                    <li class="uk-disabled"><a href="#">Disabled</a></li>
                </ul>
            </div>

            <div>
                <h2 class="uk-h5 uk-heading-divider uk-margin-medium">Divider</h2>
                <ul class="uk-subnav uk-subnav-divider" uk-margin>
                    <li class="uk-active"><a href="#">Active</a></li>
                    <li><a href="#">Item</a></li>
                    <li><a href="#">Item</a></li>
                    <li class="uk-disabled"><a href="#">Disabled</a></li>
                </ul>
            </div>

            <div>
                <h2 class="uk-h5 uk-heading-divider uk-margin-medium">Pill</h2>
                <ul class="uk-subnav uk-subnav-pill" uk-margin>
                    <li class="uk-active"><a href="#">Active</a></li>
                    <li><a href="#">Item</a></li>
                    <li><a href="#">Item</a></li>
                    <li class="uk-disabled"><a href="#">Disabled</a></li>
                </ul>
            </div>

        </div>

    </div>
</div>