La taille du fichier de type d'entrée varie sous Linux/Windows

Question

J'ai un élément input type="file" avec size="70" et width="522px". Il semble et fonctionne bien dans tous les navigateurs sur Windows mais dans Firefox sur Linux, l'élément d'entrée est plus grand que 522 pixels.

choses que j'essayé:

1. max-width:522px mais il ne fonctionne pas (Linux).
2. le réglage size="52" et min-width:522px; semble bien dans Linux mais ne fonctionne pas dans Firefox sur Windows.

Que puis-je faire pour spécifier la largeur 522 pixels?

Answer 1

Le problème est que le navigateur ne considère pas le bouton dans le cadre de l'entrée. Donc, si vous avez quelque chose comme:

<div style="width: 500px; overflow: hidden"> 
<input type="file" id="uploadfile_0" class="fileinput" style="border: 2px solid #a9a9a9; width: 100%; height: 22px;" name="uploadfile_0"/> 
</div> 

Le bouton de navigation est entrée en dehors du parent, et je ne pense pas qu'il y ait une solution facile à ce sujet.

Vous pouvez lire about styling input type="file" sur Quirksmode.org

Answer 2

ne donnez que CSS width, comme ceci:

<input type="file" style="width: 522px;" ..... /> 

Answer 3

La seule façon que je l'ai jamais vu des champs de saisie de fichiers est par un de style tour où le champ est en fait sur le dessus d'une image et le champ est donnée zéro opacité .

Answer 4

function inFil() { 
    var inFil = document.getElementById("inFil"); 
    var iSize = inFil.files[0].size; 
    alert(iSize); 
    // where inFil is existing html tag <input type="button" id="inFil" > 
} 

Fonctionne avec Firefox, mais ne fonctionne pas avec IE8, les autres n'ont pas été testés.