javascript - How to make a non-displayed input or its label `keyboard tab stoppable`? -

to have customized input file, i've made hidden by:

 input[type="file"]{display:none;} 

and have put background label:

 label.uploadfilelabel {background-image:url(../image.jpg);} 

this approach works fine, has introduced problem: keyboard tab not stop on button , label. tried using tabindex="0" no result. there way stop keyboard tab on hidden button?

of course, prefer pure css solution, javascript solution (without jquery) acceptable.

thanks sharing

update: here fiddle of problem. tested, works in ie , firefox not in chrome

you should try this. works, keep in mind html5.

<input type="file" tabindex="-1">