Styling file inputs
I think it’s really annoying and stupid that you can’t style the Browse button on file input tags. It’s also annoying that you can’t set the value in a file input tag (for example, if there was an error on a form, it would be nice to redisplay the form with the value the user had previously entered, so they wouldn’t have to browse to the file yet again), but I understand that it makes sense from a security standpoint. You don’t want malicious javascript code setting the value and trying to grab files from the user’s hard disk. I can even see why you would want to prevent us from changing the text from “Browse” to something else, to avoid confusing or tricking the user.
But why oh why can’t we style the button? Is that so much to ask? Actually, we can style the border and the text of the button, but we can’t do a thing about the background color. We can style all the other buttons in our forms. But then the Browse button sticks out like a sore thumb and messes up the whole appearance of the page.
Would it be too much to hope that a future version of CSS will allow us to style file inputs?
March 31st, 2004 at 12:16 pm
Funny, I’m upset with CSS today also…Glad your site is up again, still some problems though, everything loads very slowly. Have a good day.
April 1st, 2004 at 10:04 am
Isn’t it because the button is actually an OS interface rather than a web interface? I hope that there is a way for CSS to work it out in the future.
April 1st, 2004 at 2:19 pm
I’m not sure whether the browse button is an OS control or not. I would think it would depend on the browser - there’s no requirement that it has to be an OS control, right?
IE is pretty good about letting you style the file input. The only problem is that there’s no way to distinguish between the text field and the browse button. So if you set a background color or border, it ends up being applied to both.
Firefox, on the other hand, appears to style the background and font of the text field, but not the border. And it doesn’t style the button at all.
I guess it’s not too big of an issue for most website developers, since they probably don’t have much reason to use file inputs very often. For web applications, though, they come up quite often (importing saved configuration files, importing other files into the application, etc.)