html input and select different height

html, input, select

Solution

This can be corrected by setting the `box-sizing` property of your elements to `border-box`:

input, select{
  box-sizing: border-box;
}

Vendor specific prefixes like `moz-` or `webkit-` might apply.

Problem

I set height: ``` input,select{height: 20px;} ``` but in browser it height is `input : 20px` and `select 18px`, I dont know why because before input and select was reseted. If I remove `<!DOCTYPE html>` then is ok, but then IE not centering page.

Original source

Related problems