diff --git a/src/lib/tabs/tab-body.scss b/src/lib/tabs/tab-body.scss
index 63daba18ea1a..a0e127070acd 100644
--- a/src/lib/tabs/tab-body.scss
+++ b/src/lib/tabs/tab-body.scss
@@ -1,6 +1,11 @@
 @import '../core/style/vendor-prefixes';
 
 .mat-tab-body-content {
+  // Avoids repainting while scrolling.
+  @include backface-visibility(hidden);
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
   height: 100%;
   overflow: auto;
 
diff --git a/src/lib/tabs/tab-group.scss b/src/lib/tabs/tab-group.scss
index c5a148d777fd..dfb48a940fdd 100644
--- a/src/lib/tabs/tab-group.scss
+++ b/src/lib/tabs/tab-group.scss
@@ -39,13 +39,15 @@
   position: relative;
   overflow: hidden;
   display: flex;
+  flex-grow: 1;
   transition: height $mat-tab-animation-duration $ease-in-out-curve-function;
 }
 
 // Wraps each tab body
 .mat-tab-body {
   @include mat-fill;
-  display: block;
+  display: flex;
+  flex-direction: column;
   overflow: hidden;
 
   // Fix for auto content wrapping in IE11