Unsetting buttons

It’s not uncommon to style the button and a[href] elements to look the same throughout your website or application. This often means resetting the default button styling and dealing with browser inconsistencies to make them visually similar.

One method to get you to a sane starting point, is to unset all of the default styling for both elements as shown below.

button, .button {
all: unset;

Check out the CodePen to see it in action.

Browser support is limited, so be sure to check your requirements before using this method.