[thelist] using CSS on file upload "Browse..." button

Bob Haroche spambait at onpointsolutions.com
Wed Mar 5 13:52:00 CST 2003

Sarah Sweeney wrote:
> Does anyone know if it is possible to change the appearance,
> using CSS, of the "Browse..." button in an HTML form file upload
> field?

Currently you can't directly with CSS. There's a javascript trick to
achieve the identical effect, however if implemented that trick
prevents the form from actually uploading any data (probably due to
some sort of browser security feature). Thanks to .jeff for pointing
that out to me.

Any way, you're stuck with the default color of the upload button, buy
I've found that some browsers will follow CSS border width settings,
or at least interpret them in "interesting" ways.

> Also, if I want to define a style just for <input> tags of a
> certain type (e.g. type="button"), how would I specify this in
> CSS?

Here's how I do it:

input.FormButton {
 background-color: #b5dcb8;
color: #5b4223;
 font-size: 11px;
 font-weight: bold;
 letter-spacing: 1px;
 padding: 1px;
input.FormText {
 background-color: #ffffff;
 color: #000000;
 border: 1px solid ;
textarea {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 border: 1px solid #000000;

Bob Haroche
O n P o i n t  S o l u t i o n s

More information about the thelist mailing list