diff --git a/src/demo-app/demo-app/demo-app.html b/src/demo-app/demo-app/demo-app.html
index fb301db67ca..42692ff6f48 100644
--- a/src/demo-app/demo-app/demo-app.html
+++ b/src/demo-app/demo-app/demo-app.html
@@ -1,4 +1,4 @@
-<mat-sidenav-container fullscreen>
+<mat-sidenav-container class="demo-container">
   <mat-sidenav #start>
     <mat-nav-list>
       <a *ngFor="let navItem of navItems"
diff --git a/src/demo-app/demo-app/demo-app.scss b/src/demo-app/demo-app/demo-app.scss
index 6e635dd8b53..b6d88965417 100644
--- a/src/demo-app/demo-app/demo-app.scss
+++ b/src/demo-app/demo-app/demo-app.scss
@@ -1,5 +1,11 @@
+html, body {
+  width: 100%;
+  height: 100%;
+}
+
 body {
   font-family: Roboto, 'Helvetica Neue', sans-serif;
+  margin: 0;
 
   // Helps fonts on OSX looks more consistent with other systems
   // Isn't currently in button styles due to performance concerns
@@ -10,6 +16,7 @@ body {
 
   .mat-sidenav {
     min-width: 15vw;
+    position: fixed;
 
     .mat-button {
       width: 100%;
@@ -48,3 +55,8 @@ body {
   height: 100%;
   box-sizing: border-box;
 }
+
+.demo-container {
+  min-width: 100%;
+  min-height: 100%;
+}