Foundation 4 - Sections- Centering Tabs

Foundation 4 - Sections- Centering Tabs

Problem: Attempting to Create 6 centered tabs in a row, however because I
can't keep all 6 tabs on the same row. It does center the tabs, however
pushes 2 of the tabs one line below and leaves an extra empty cell on the
first line.
I tried using small-centered and made no difference.
Version: Foundation 4
Browser: Chrome - Latest
Code
<div class="row">
<div class="large-6 large-centered columns">
<div class="section-container horizontal-nav"
data-section="horizontal-nav" >
<section class="section">
<p class="title"><a href="#">Tab 1</a></p>
</section>
<section class="section">
<p class="title"><a href="#">Tab 2</a></p>
</section>
<section class="section">
<p class="title"><a href="#">Tab 3</a></p>
</section>
<section class="section">
<p class="title"><a href="#">Tab 4</a></p>
</section>
<section class="section">
<p class="title"><a href="#">Tab 5</a></p >
</section>
<section class="section">
<p class="title"><a href="#">Tab 6</a></p>
</section>
</div>
</div>
</div>