Today at work I was asked how to remove the extra padding added to buttons (both the button tag and input[type=button]) in Internet Explorer.

The Problem:

In the example below there is a standard button with 10px padding on all sides. Internet explorer chooses to add additional horizontal padding:

The solution:

After coming across this problem myself in the past, I eventually remembered that there are two CSS styles you can add to fix this bug feature in IE:

button {
	width: auto;
	overflow: visible;
}