diff --git a/demo-app/src/app/navbar/navbar.component.html b/demo-app/src/app/navbar/navbar.component.html
index 6480340f..6c9108c5 100644
--- a/demo-app/src/app/navbar/navbar.component.html
+++ b/demo-app/src/app/navbar/navbar.component.html
@@ -41,7 +41,7 @@ <h5 class="light">Right aligned items</h5>
 
   <div class="col s12">
     <mz-navbar>
-      <a href="javascript:void(0)" class="brand-logo">Logo</a>
+      <a href="javascript:void(0)" class="brand-logo left">Logo</a>
       <mz-navbar-item-container [align]="'right'">
         <mz-navbar-item><a href="javascript:void(0)">Sass</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Components</a></mz-navbar-item>
@@ -78,7 +78,7 @@ <h5 class="light">Centering the logo</h5>
   <div class="col s12">
     <mz-navbar>
       <a href="javascript:void(0)" class="brand-logo center">Logo</a>
-      <mz-navbar-item-container [align]="'right'">
+      <mz-navbar-item-container [align]="'right'" class="hide-on-med-and-down">
         <mz-navbar-item><a href="javascript:void(0)">Sass</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Components</a></mz-navbar-item>
         <mz-navbar-item><a routerLink="js">JavaScript</a></mz-navbar-item>
@@ -95,13 +95,13 @@ <h5 class="light">Centering the logo, and left and right items</h5>
 
   <div class="col s12">
     <mz-navbar>
-      <mz-navbar-item-container [align]="'left'">
+      <mz-navbar-item-container [align]="'left'" class="hide-on-med-and-down">
         <mz-navbar-item><a routerLink="js">JavaScript</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Components</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Sass</a></mz-navbar-item>
       </mz-navbar-item-container>
       <a href="javascript:void(0)" class="brand-logo center">Logo</a>
-      <mz-navbar-item-container [align]="'right'">
+      <mz-navbar-item-container [align]="'right'" class="hide-on-med-and-down">
         <mz-navbar-item><a href="javascript:void(0)">Sass</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Components</a></mz-navbar-item>
         <mz-navbar-item><a routerLink="js">JavaScript</a></mz-navbar-item>
@@ -118,7 +118,7 @@ <h5 class="light">Active items</h5>
 
   <div class="col s12">
     <mz-navbar>
-      <a href="javascript:void(0)" class="brand-logo">Logo</a>
+      <a href="javascript:void(0)" class="brand-logo left">Logo</a>
       <mz-navbar-item-container [align]="'right'">
         <mz-navbar-item><a href="javascript:void(0)">Sass</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Components</a></mz-navbar-item>
@@ -142,7 +142,7 @@ <h5 class="light">Navbar dropdown menu</h5>
       <li><a href="javascript:void(0)">three</a></li>
     </ul>
     <mz-navbar>
-      <a href="javascript:void(0)" class="brand-logo">Logo</a>
+      <a href="javascript:void(0)" class="brand-logo left">Logo</a>
       <mz-navbar-item-container [align]="'right'">
         <mz-navbar-item><a href="javascript:void(0)">Sass</a></mz-navbar-item>
         <mz-navbar-item><a href="javascript:void(0)">Components</a></mz-navbar-item>
diff --git a/src/app/navbar/navbar-item-container/navbar-item-container.component.html b/src/app/navbar/navbar-item-container/navbar-item-container.component.html
index d53a5666..05935456 100644
--- a/src/app/navbar/navbar-item-container/navbar-item-container.component.html
+++ b/src/app/navbar/navbar-item-container/navbar-item-container.component.html
@@ -1,3 +1,3 @@
-<ul id="nav-mobile" class="{{ align }} hide-on-med-and-down">
+<ul id="nav-mobile" class="{{ align }}">
   <ng-content></ng-content>
 </ul>
\ No newline at end of file
diff --git a/src/app/navbar/navbar-item-container/navbar-item-container.component.view.spec.ts b/src/app/navbar/navbar-item-container/navbar-item-container.component.view.spec.ts
index 1cc5fec3..0d917162 100644
--- a/src/app/navbar/navbar-item-container/navbar-item-container.component.view.spec.ts
+++ b/src/app/navbar/navbar-item-container/navbar-item-container.component.view.spec.ts
@@ -31,7 +31,6 @@ describe('MzNavbarItemContainerComponent:view', () => {
 
         expect(itemContainer()).toBeTruthy();
         expect(itemContainer().id).toContain('nav-mobile');
-        expect(itemContainer().classList).toContain('hide-on-med-and-down');
       });
     }));