Google Chrome input is set to line-height and the cursor becomes as high as input

When the height and line-height of Google Chrome input are set to the same value that is higher than the default height, when the input control receives the focus and no input is entered, the The cursor in input fills the entire input control (if Padding-top or Padding-bottom is set below the height of the entire control), but the cursor height reverts to the height of the font immediately after the entry, and the case code is as follows, so how do you solve this problem?

<! DOCTYPE html>
Google Chrome input Line-height Bug Solution

 
 

  
  
 
   
 
    
Remove the Inline-height attribute, but this causes the cursor of input in the Ie6/7/8 browser to be offset to the upper left of input, in the standard browser (specifically Google Chrome, Firefox, Opera, Safari, IE + +), If you set the height for input without setting line-height, the browser automatically aligns the content in input with the cursor vertically, and the height of the cursor is the same as the height of the word. IE8 and earlier non-standard, the height and line-height must be set to the same value in order to make the contents of input vertically aligned, so fix a browser, but damaged more browsers, it is not worth the candle, see the following perfect solution.
 
    
Add a style input[type= "text"]:focus{line-height:normal}, which causes the input cursor in IE8 to be offset to the upper left of input, IE6/7/9 and the updated version are displayed normally. As long as you add a CSS hack, you can solve the problem, to achieve all major browser compatibility: input[type= "text"]:focus{line-height:normal; line-height:2.4em\9;}, The 2.4em is the originally set value.
 
    
Google Chrome 39 has fixed this bug, which is the perfect solution.
 
   
 
  
 
 
Google Chrome input is set to line-height and the cursor becomes as high as input