title: zurb-foundation icon as a dropdown menu
body: <p>I'm having trouble using the foundation Icon set. I'd like to use an icon as the button for a dropdown menu in my navbar. </p>
  
  <pre><code>&lt;div class="contain-to-grid sticky"&gt;
    &lt;nav class="top-bar" data-topbar role="navigation" data-options="sticky_on: large"&gt;
      &lt;ul class="title-area"&gt;
        &lt;li class="name"&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/100x45&amp;text=Logo"/&gt;&lt;/a&gt;
        &lt;/li&gt; 
        &lt;li class="toggle-topbar menu-icon"&gt;&lt;a href="#"&gt;menu&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
      &lt;section class="top-bar-section"&gt;
        &lt;ul class="right"&gt;
          &lt;li&gt;
            &lt;i class="fi-thumbnails has-dropdown"&gt;&lt;/i&gt;
            &lt;ul class="dropdown"&gt;
              &lt;li&gt;All&lt;/li&gt;
              &lt;li&gt;Art&lt;/li&gt;
              &lt;li&gt;Music&lt;/li&gt;
              &lt;li&gt;Lifestyle&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;i class="fi-list has-dropdown" href="#"&gt;menu&lt;/i&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/section&gt;
    &lt;/nav&gt;
  &lt;/div&gt;   
  </code></pre>
  
  <p>any advice?</p>