Explorer Windows and Mozilla bug - button box model

Both Explorer 6 Windows and Mozilla always give a button the traditional box model instead of the W3C one, even in strict mode.

Take this CSS

input {
	height: 20px;
	padding: 0;
	border: 1px solid #000000;

and apply it to these inputs:

If we give two input elements the same height, padding and border it stands to reason that they have the same height, regardless of box model.

Unfortunately, that turns out not to be the case when one of the inputs is a submit button. Explorer Windows and Mozilla always use the traditional box model (height = borders + padding + content) to button elements, even in strict mode. Since they both correctly use the W3C box model for the normal input field, the inputs end up having a different height.


For Mozilla, add -moz-box-sizing: content-box to the button. Unfortunately this bug is unsolvable in Explorer.