Styling the browse button to look like a link

Question

Possible Duplicate:
Making a <button> that's a link in HTML
How apply CSS to browse button

How to style the browse button to look like a link?

I mean the

<input type=file />

Answer 1

Try this approach:

1. Overlay a div on top of input file.

2. Change the opacity of input file to 0.

   div.text {
       position: absolute;
       top: 0;
       left: 0;
       text-decoration: underline;
       color: blue;
   }
   div.wrapper {
       position: relative;
   }
   input { opacity: 0; }
   ​
   
   <div class="wrapper">
        <div class="text">I'm not a link you fool</div>
       <input type="file"/>
   </div>
   ​
   

Demo: http://jsfiddle.net/codef0rmer/BZeMG/

Answer 2

this tutorial should be help u,

http://www.quirksmode.org/dom/inputfile.html

Answer 3

If you're talking about the browse button of a <input type=file /> you can't do that. You have to go for a jquery/ajax file upload plugin, that replaces the original button with something custom. Take a look at the list here:

http://creativefan.com/10-ajax-jquery-file-uploaders/

and see if you find something you like.