Don’t bother styling form fields, every browsers handles them differently on every OS. Setting them into a specific order is fine. But changing the appearance like changing the browse button on file upload fields will never work.
You can change the look of form inputs with css but beaware that for the browse button (for browsing for a file), the style of this can never be changed. The support for what can be done to change the look form elements like has already been said will vary from browser to browser so you should try and test to see what works with what browser for each potential browser version being used by the target audience.
All I want to do is put some SPACE between the Input Box and the Button. (I don’t like how they touch each other?!)
I did not say I wanted to style the Input or Button themselves. I just want some breathing room, and the code posted above has worked in any other Form situation.
If you are talking about the “Browse” button, you cannot move it, you cannot change it, cannot do anything with it. Thats the point. If you are talking about another button you created…Thats entirely different.
logic_earth got it right the first time… Do you SEE two separate elements in your code? No, you have ONE input of type FILE… So NO, you cannot put a space between the input and it’s auto-generated button. That’s all ONE HTML element, so styling it there’s only ONE thing there – it exists only ONCE in the DOM – your margin being applied to the right of the ENTIRE element.
input[file] – that’s all there is… one single DOM element – might LOOK like two when rendered (the text box and the button) but it’s only actually ONE.
Again, default appearance has nothing to do with what a tag is or how it works.