Styling the height of a input type='file' element in chrome

Question

I have a html form input of type file:

<input type='file' />

I am aware of the styling limitation around this element and the workarounds (parent div, hidden field with click events etc) if you want some custom styling on it, which is not what I'm looking for.

My issue is pretty simple, if I apply height to the element, IE and Firefox set the element height just like all other input types, but chrome is ignoring the height attribute.

input{
    height:50px;
}

Here is a jsfiddle

Is there away to get chrome to honor the height. Seems a simple thing but adding !important or adding the height inline doesn't make a difference.

N.b. there are LOADS of question about styling a file input on SO, but none address getting the height attribute to be honored in chrome. It works fine in other browsers.

I'm also aware that increasing the font size will make the input bigger, however its not an attractive solution.

Is setting height now possible in chrome?

Answer 1

This is how chrome understands it with pseudo code- PseudoCode css

I have updated my link-

  input[type="file"]{
        height:50px;
  }

    input[type="file"]::-webkit-file-upload-button{
        height:50px;
  }

find the changes- http://jsfiddle.net/xfv0otLL/3/