Question

Is there a way to hide the browse button and only leave the text box that works in all browsers?

I have tried setting the margins but they show up different in each browser

Answer 1

No, what you can do is a (ugly) workaround, but largely used

1. Create a normal input and a image
2. Create file input with opacity 0
3. When the user click on the image, you simulate a click on the file input
4. When file input change, you pass it’s value to the normal input (so user can see the path)

Here you can see a full explanation, along with code:

http://www.quirksmode.org/dom/inputfile.html