Bootstrap 3.0 Button in Navbar

Wrap a <p class="navbar-btn"> around the <a class="btn">:

<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <ul class="nav navbar-nav">
            <li>
                <p class="navbar-btn">
                    <a href="#" class="btn btn-default">I'm a link button!</a>
                </p>
            </li>
        </ul>
    </div>
</nav>

JSFiddle: http://jsfiddle.net/lachlan/398kj/

Screenshot:
Bootstrap link button in navbar


Now, bootstrap 3 has buttons in the navbar like this:

<button type="button" class="btn btn-default navbar-btn">Sign in</button>

It uses navbar-btn so it knows it's in the navbar.

If you want it to work, do this:

<li>
    <form action="#">
        <button class="btn btn-default navbar-btn">Link</button>
    </form>
</li>

This way, it still acts like an anchor tag. Just change # for the value you actually want it to go to.

So for this instance:

<li>
    <form action="<?php echo BASE_PATH; ?>register.php">
        <button class="btn btn-default navbar-btn">Link</button>
    </form>
</li>

With bootstrap 3, it is still possible to have a <a>link rendered as a button, but you have to include them into a <form>. Also, the <a> should include the navbar-btn class.

<li>
  <form>
    <a href="#" class="btn btn-primary btn-sm navbar-btn">
      register
    </a>
  </form>
</li>