Le style CSS sur l'Entrée de type de Fichier

Je suis le style d'une Entrée de type de Fichier en utilisant uniquement CSS, et il fonctionne sur tous les navigateurs attendre Firefox 11.0.
CSS:

label{ 
 background:url(http://www.itilexamapp.com/images/upload.png) no-repeat 0 0;
 padding:5px;
 display:inline-block;
}

input[type="file"]
{ -moz-opacity:0; 
 -webkit-opacity:0; 
 filter:alpha(opacity=0); 
 padding:6px;
 width:200px; 
}

HTML:

<label>
<input type="file" name="file_upload" />
</label>

Vous pouvez voir le code de travail ici:

http://jsfiddle.net/kheema/PeXq9/7/

S'il vous plaît, ne pas jamais comme ça. Pour une chose, vous ne pouvez pas supposer que tous les navigateurs ne l'aime que. Comment votre code avec les anciens navigateurs comme IE8? Comment ça va fonctionner avec les navigateurs mobiles? Comment ça va fonctionner avec les navigateurs que vous ne connaissez pas?
double possible de Style <input type="file">
Par ailleurs, il existe dans beaucoup de doublons. Beaucoup, beaucoup.
Je voudrais aussi éviter de style à tous. Aussi, vous savez le champ de texte n'est pas renseigné avec le nom de fichier (ce qui est normalement), droit? Alors pourquoi même l'avoir dans l'image?
Je suis tout à fait d'accord avec Chris commentaires. Il faut que je pense à propos de linux, navigateur et d'envisager le navigateur opera. Je pense que le bon et solution acceptable est que je doit utiliser uniform.js bibliothèque jquery pour fonctionner dans tous les navigateurs.

OriginalL'auteur Kheema Pandey | 2012-04-04