diff --git a/packages/mdl-button/mdl-button.scss b/packages/mdl-button/mdl-button.scss
index 0737702b1..7d41b38fe 100644
--- a/packages/mdl-button/mdl-button.scss
+++ b/packages/mdl-button/mdl-button.scss
@@ -40,8 +40,8 @@
   box-sizing: border-box;
   -webkit-appearance: none;
 
-  &::before,
-  &::after {
+  /* postcss-bem-linter: ignore */
+  &::before {
     position: absolute;
     top: 0;
     left: 0;
@@ -49,12 +49,8 @@
     height: 100%;
     transition: opacity 120ms cubic-bezier(0, 0, .2, 1);
     border-radius: inherit;
-    content: "";
-  }
-
-  /* postcss-bem-linter: ignore */
-  &::before {
     background: currentColor;
+    content: "";
     opacity: 0;
   }
 
@@ -62,16 +58,8 @@
     opacity: .12;
   }
 
-  &::after {
-    width: 100%;
-    height: 100%;
-    background: black;
-    opacity: 0;
-    overflow: hidden;
-  }
-
-  &:active::after {
-    opacity: .06;
+  &:active::before {
+    opacity: .18;
   }
 
   &:active {