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.
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.
I was able to set the height of my SELECT to exactly what I wanted in IE8 and 9.  The trick is to set the box-sizing property to content-box. Doing so will set the content area of the SELECT to the height, but keep in mind that margin, border and padding values will not be calculated in the width/height of the SELECT, so adjust those values accordingly.
select {
    display: block;
    padding: 6px 4px;
    -moz-box-sizing: content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
    height: 15px;
}
Here is a working jsFiddle. Would you mind confirming and marking the appropriate answer?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With