Skip to content

Instantly share code, notes, and snippets.

@MoOx
Created February 21, 2014 16:20
Show Gist options
  • Save MoOx/9137295 to your computer and use it in GitHub Desktop.
Save MoOx/9137295 to your computer and use it in GitHub Desktop.
%reset-Button {
border: none;
margin: 0;
padding: 0;
width: auto;
overflow: visible;
background: transparent;
/* inherit font & color from ancestor */
color: inherit;
font: inherit;
/* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
line-height: normal;
/* Corrects font smoothing for webkit */
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
/* Corrects inability to style clickable `input` types in iOS */
-webkit-appearance: none;
}
/* Remove excess padding and border in Firefox 4+ */
&::-moz-focus-inner {
border: 0;
padding: 0;
}
@toukoum
Copy link

toukoum commented May 15, 2024

I think nowadays you just need this:

button {
  all: unset;
}

It starts inheriting all the values like you'd expect, with the exception that:

  • it still behaves like inline-block
  • the text is still vertically centered

boss 🤯

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment