1

I have written following code which generates a browse and upload button.i want to change the default style of browse button.explain me how to do that.

<input id="formButton" type="file" name="csv" size="40" value="" />
<input type="submit" name="upload_bulk_trainees" value="Upload" />
Your Common Sense
  • 156,878
  • 40
  • 214
  • 345
n92
  • 7,424
  • 27
  • 93
  • 129
  • 1
    possible duplicate of [How to style a file upoad?](http://stackoverflow.com/questions/4441341/how-to-style-a-file-upoad) – Pekka Apr 11 '11 at 09:29
  • possible duplicate of [What is the best way to replace the file browse button in html?](http://stackoverflow.com/questions/108149/what-is-the-best-way-to-replace-the-file-browse-button-in-html) – lonesomeday Oct 23 '12 at 21:58
  • This is not possible in a regular way. There are only some "hacks". You may find a solution in [this article on quirksmode.org](http://www.quirksmode.org/dom/inputfile.html). – micha149 Apr 11 '11 at 09:30

3 Answers3

1

Styling of type="file" fields is extremely limited. Some browsers allow more customization than others - but the general rule is that you better don't expect any styling to apply for those fields.

ThiefMaster
  • 310,957
  • 84
  • 592
  • 636
0

I don't believe this is possible. As a security measure, these input controls are kept with a standard look so that users always know what they're interacting with.

nickf
  • 537,072
  • 198
  • 649
  • 721
-1

either use the style tag

<input type="submit" name="upload_bulk_trainees" style="background-color: blue" value="Upload" />

or a css class

<style type="text/css">
.button {
 background-color: red; 
}
</style>
<input type="submit" name="upload_bulk_trainees" class="button" value="Upload" />
sharpner
  • 3,857
  • 3
  • 19
  • 28