Zurb Foundation Sticky Nav Bar

Question

So I'm using the default .top-bar class from the zurb foundation framework, but I'm failing a find a simple way to make the nav bar 'sticky' (follows the user as he scrolls), such as you can do with Twitter bootstrap.

Here's my code, I'm using jade:

nav.top-bar
  ul
    li.name
      h1
        a(href='#') Site Title
    li.toggle-topbar
      a(href='#')

  section
    ul.left
      li.divider
      li
        a.active(href='#') Link
      li.divider
      li
        a.active(href='#') Link
      li.divider
      li
        a.active(href='#') Link
      li.divider
      li
        a.active(href='#') Link
      li.divider
  section
    ul.right
      li.divider
      li.has-dropdown
        a.active(href='#') Log in

Am I missing something completely obvious here?

Answer 1

From the docs page: http://foundation.zurb.com/docs/navigation.php

Positioning the Bar

The top bar is built with a single nav element with a class of top-bar. It will take on full browser width by default. To make the top bar stay fixed as you scroll, wrap it in div class="fixed". If you want your navigation to be set to your grid width, wrap it in div class="contain-to-grid". You may use fixed and contain-to-grid together.