Center nav with Angular Material
<p>I tried to center my navbar but when i use layout-align='space-between center' it isn't taking 100% width, and it is behaving like an inline element.</p>

<p>I am following the documentation but nothing works... here's the code:</p>

<pre><code>&lt;body ng-app="PetApp" layout='row'&gt;

&lt;div layout="row" flex&gt;
  &lt;md-nav-bar layout-fill aria-label='Main Menu' md-selected-nav-item="currentNavItem"&gt;
      &lt;md-nav-item md-nav-sref='#inicio' name="inicio"&gt;Inicio&lt;/md-nav-item&gt;
      &lt;md-nav-item md-nav-sref="#conheca" name="conheca"&gt;O Aplicativo&lt;/md-nav-item&gt;
      &lt;md-nav-item md-nav-href="#cadastro" name='cadastro'&gt;Cadastre-se&lt;/md-nav-item&gt;
      &lt;md-nav-item md-nav-href="#contato" name='contato'&gt;Contato&lt;/md-nav-item&gt;
  &lt;/md-nav-bar&gt;
&lt;/div&gt;

&lt;script src="node_modules/angular/angular.min.js"&gt;&lt;/script&gt;
&lt;script src="node_modules/angular-material/angular-material.min.js"&gt;&lt;/script&gt;
&lt;script src="node_modules/angular-animate/angular-animate.min.js"&gt;&lt;/script&gt;
&lt;script src="node_modules/angular-aria/angular-aria.min.js"&gt;&lt;/script&gt;

&lt;script type="text/javascript"&gt;
  angular.module('PetApp', ['ngMaterial']);
&lt;/script&gt;
</code></pre>

<p></p>

<p>Thanks in advance!</p>