Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vertically center text in text input in Internet Explorer

I am having trouble vertical aligning text in an input field in Internet Explorer.

I have:

input#search {
    float:left;
    font-size:11px;
    height:20px;
    margin:0;
    padding-left:4px;
    width:100px;
}

In Firefox and Chrome, it seems to be automatically vertical aligned, however in Internet Explorer it is not.

like image 904
jcoahd Avatar asked Mar 01 '11 10:03

jcoahd


2 Answers

Just set the height and line-height for the input object and it works fine (ie 7+).

input { border: 0; font-size: 0.8em; height: 32px; line-height: 32px;}

gl Paulo Bueno

like image 193
Paulo Bueno Avatar answered Oct 17 '22 09:10

Paulo Bueno


Just define line-height and height for a text box with same value. It will be taken care

like image 26
Chinni Avatar answered Oct 17 '22 08:10

Chinni