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
  • 154,967
  • 38
  • 205
  • 325
n92
  • 7,116
  • 27
  • 91
  • 128
  • 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
  • 298,938
  • 77
  • 579
  • 623
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
  • 520,029
  • 197
  • 633
  • 717
-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,719
  • 3
  • 18
  • 27