How to style the browse button?

Hi,

I have a field where people can upload files. It looks like this:

<input class="txt" name="userfile[]" type="file" />

But the "browse" button next to the input field is not styled, it looks really ugly...
Is it possible to style with CSS?

 

As you can see, it already has a class applied to it which is called "txt". You need to find the style sheet and locate the .txt class and modify it, if it doesn't exist then just create one.

 

????
the class "txt" styles in input text field... Not the BROWSE button.
Better not reply if you don't know the answer and just want to get your postcount up...

 

You mean something like Stylish submit buttons?

 

lol, I just woke up, so I overlooked the fact that he posted code for the text field, rather than the button. Besides this, what I said still applies, he just needs to add a class attribute to the button, and apply some style to it, just as explained in the link in the post above ^.

 

Use the .submit tag in your CSS to style the submit button

 

Nope, you can't style the browse button in any browser other than IE.
http://image.vimfun.com/ (has the default button when view in Firefox)

There are some tricks to get around it though. Try to search for "fake browse button" in google.

 

you can style the browse button in browsers other than IE. im certain of it.

 

By apply a class/id to it and use css to style?

 

Based on my tests, it appears that the style applies to the Browse button as well as the text field. In which case, the suggested presented above makes sense to create a separate "fake" submit button which would be styled separately.

 

IMO you should leave it as is, because a user will easily spot it 'cause it adapts to the OS and not to the site.

 

Yeah everyone with Mac/Safari sees these little cutsie bubble-buttons that look like candyyyyyyyyyyy and shiny. No matter how you style it.

Another reason I don't have a Mac.

 

My advice, design the button you want as an image inside an anchor with javascript doing a document.write to create it and make the submit work, and then a noscript that's a normal submit. Most of the world leaves .js on, and the ones smart enough to turn it off usually end up on a browser like Opera or Firefox where you can turn off the stuff .js was allowed to do it never should have so they can have that functionality, meaning it nabs MOST users with the styled button... and with a noscript you have a fallback.