Html 基础插入进度条进入顶部栏 我使用框架基础5，我使用，我想插入到顶部的一个简单的

唯一的问题是progross条不是水平的，而是垂直的。真奇怪，我不知道怎么纠正

<nav class="top-bar" data-topbar="">
  <!-- Title -->
  <ul class="title-area">
    <li class="name"><h1><a href="#">Sexy Top Bar</a></h1></li>

    <!-- Mobile Menu Toggle -->
    <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
  </ul>

  <!-- Top Bar Section -->

<section class="top-bar-section">


    <!-- Top Bar Right Nav Elements -->
    <ul class="right">

       <!-- progess bar bug -->
       <li>
           <div class="progress">
              <span class="meter"></span>
            </div>
      </li>
      <li class="divider"></li>

      <!-- Anchor -->
      <li><a href="#">Generic Button</a></li>
      <li class="divider"></li>

      <!-- Button -->
      <li class="has-form show-for-large-up">
        <a href="http://foundation.zurb.com/docs" class="button">Get Lucky</a>
      </li>
    </ul>
  </section></nav>

它不是垂直的，只是没有宽度

修正：

div.progress{
    width: 500px;
}