fix(button): make margin reset less browser specific

carbon-design-system · Jan 28, 2020 · b0fdec3 · b0fdec3
1 parent d1c0061
commit b0fdec3
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 16 deletions.
diff --git a/packages/components/src/components/button/_button.scss b/packages/components/src/components/button/_button.scss
@@ -43,15 +43,6 @@
     }
   }
 
-  // Safari only fix to remove added margins on buttons (see #5155)
-  @media not all and (min-resolution: 0.001dpcm) {
-    @supports (-webkit-appearance: none) {
-      .#{$prefix}--btn {
-        margin: 0;
-      }
-    }
-  }
-
   // Reset intrisic padding in Firefox (see #731)
   .#{$prefix}--btn::-moz-focus-inner {
     padding: 0;

diff --git a/packages/components/src/components/button/_mixins.scss b/packages/components/src/components/button/_mixins.scss
@@ -29,6 +29,8 @@
   outline: none;
   position: relative;
   max-width: rem(320px);
+  // Fix to remove added margins on buttons in safari (see #5155)
+  margin: 0;
 
   &:disabled,
   &.#{$prefix}--btn--disabled {

diff --git a/packages/components/src/globals/scss/_css--reset.scss b/packages/components/src/globals/scss/_css--reset.scss
@@ -190,13 +190,9 @@
       box-sizing: border-box;
     }
 
-    // Safari only fix to remove added margins on buttons (see #5155)
-    @media not all and (min-resolution: 0.001dpcm) {
-      @supports (-webkit-appearance: none) {
-        button {
-          margin: 0;
-        }
-      }
+    // Fix to remove added margins on buttons in safari (see #5155)
+    button {
+      margin: 0;
     }
 
     @include carbon--type-reset;