title: How can i create a navbar with center aligned links using Materialize?
body: <p>I am trying to build a 1 page vertical scrolling website with a navbar at the top using materialize, now,  materialize only has classes to align the links either left or right, a logo can be center aligned but not the links themselves, </p>
  
  <p>I've been adding center-align, and center classes to the UL and a wrapper div, and also, tried using the grid without success, here is my code:</p>
  
  <p>HTML</p>
  
  <pre><code>   &lt;div class="navbar-fixed"  &gt;
      &lt;nav id="nav_f" class="transparent z-depth-0" role="navigation" &gt;
          &lt;div class="container"&gt;
  
  
  
              &lt;div class="nav-wrapper"  &gt;
  
               &lt;div class="row s12"&gt;
  
              &lt;div&gt;
                    &lt;ul class="hide-on-med-and-down navbar " &gt;
                        &lt;li&gt;&lt;a id="desk-about-us" href="#about-us"&gt;ABOUT US&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;&lt;a href="#how-it-works"&gt;HOW IT WORKS&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;&lt;a href="#comments"&gt;COMMENTS&lt;/a&gt;&lt;/li&gt;
                    &lt;/ul&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
  
                  &lt;ul id="nav-mobile" class="side-nav side-nav-menu "&gt;
                      &lt;li&gt;&lt;a href="#about-us"&gt;ABOUT US&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#how-it-works"&gt;HOW IT WORKS&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#comments"&gt;COMMENTS&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;a href="#" data-activates="nav-mobile" class="button-collapse right"&gt;&lt;i class="material-icons"&gt;menu&lt;/i&gt;&lt;/a&gt;
              &lt;/div&gt;
  
         &lt;/div&gt;
      &lt;/nav&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>On my css there is only an underline for the hovering behavior of the links and the background color,</p>