Как центрировать элементы меню в foundation.zurb?

Question

[TOPHOP]

<nav class="top-bar" data-topbar>
          <ul class="title-area">
            <li class="toggle-topbar menu-icon"><a href="#"><span>menu</span></a></li>
          </ul>
      
          <section class="top-bar-section">
            
            <ul class="right">
             
              <li class="has-dropdown">
                <a href="#">КЛИЕНТАМ</a>
                <ul class="dropdown">
                  <li><label>Технические вопросы</label></li>
                  <li><a href="#">Dropdown Option</a></li>
                  <li><a href="#">Dropdown Option</a></li>
                  <li class="divider"></li>
                  <li><label>Финансовые вопросы</label></li>
                  <li><a href="#">Dropdown Option</a></li>
                  <li><a href="#">Dropdown Option</a></li>
                  <li><a href="#">Dropdown Option</a></li>
                  <li class="divider"></li>
                  <li><a href="#">See all →</a></li>
                </ul>
              </li>
             
              <li><a href="#">ПАРТНЕРАМ</a></li>

              
                <li><a href="#">КОМПАНИЯ</a></li>
              
               <li><a href="#">КОНТАКТЫ</a></li>
            </ul>
          </section>
        </nav>

Answer 1

[Андрей Никифоров]

nav.top-bar {
    text-align:center;
}
section.top-bar-section {
    display: inline-block;
}

jsfiddle.net/mt4t7e2h
foundation.zurb.com/forum/posts/551-how-to-topbar-...