Is it possible in Zurb Foundation to have a normal button in the top bar menu items? Here is an example:
The black button is what I'm trying to accomplish.
Here is what the HTML currently looks like:
<div class="contain-to-grid">
<nav class="top-bar" data-topbar="" role="navigation">
<ul class="title-area">
<li class="name">
<h1>
<a href="/">SiteName</a>
</h1>
</li>
<li class="toggle-topbar menu-icon">
<a href="#"><span>Menu</span></a>
</li>
</ul>
<section class="top-bar-section">
<ul class="left">
<li>
<a href="#">Nav item</a>
</li>
<li>
<a href="#">Nav item</a>
</li>
<li>
<a href="#">Nav item (Should be button)</a>
</li>
</ul>
</section></nav>
</div>
Sure, just use class button
inside a has-form
list item.
<li class="has-form">
<a class="button">Button</a>
</li>