Vous pouvez faire comme suit :
- Créer un faux formulaire avec un champ text, une icone browse et une icone submit
- Dans le même formulaire, placer un vrai champ file par-dessus les 2 précédents (text/browse), grâce au span z-index et au style opacity.
- Régler éventuellement les positions relative/absolute et top/middle/bottom/left/right:Xpx de chacun des 2 spans, en fonction des size des input.

Ce qui donne quelque chose comme :

<FORM name="myform" action="page.html" method="get" enctype="multipart/form-data">
  <SPAN stype="position:relative;z-index:0;">
    <INPUT type="text" size=12 name="myFileText">
    <INPUT type="image" src="browse.gif" border="0">
    <INPUT type="image" name="submit" value="fileValue" src="submit.gif">
    <SPAN STYLE="position:absolute;middle:0px;left:0px;z-index:1;">
      <INPUT type="hidden" name="fileOp" value="fileValue">
      <SCRIPT type="text/javascript">
        function fillForm() { document.myform.myFileText.value=document.myform.upName.value; }
      </SCRIPT>
      <INPUT type="file" style="-moz-opacity:0;filter:alpha(opacity:0);-khtml-opacity:0;"
        size=1 name="upName" onkeyup="fillForm();" onmouseout="fillForm();">
    </SPAN>
  </SPAN>
</FORM>

En effet, cette solution existe,.. Mais.

Elle est développée ici : http://www.quirksmode.org/dom/inputfile.html [en] (désolé les non-anglicistes).
Et comme l'indique cette page, il existe de nombreux problèmes de compatibilité avec les différents navigateurs.

La raison est que chaque navigateur gère à sa façon l'input file et sa taille varie complètement de IE à Firefox et surtout de Safari. Hors la solution présentée ici suppose que l'input fait toujours la même taille.
-= Bobinours =-