CODEWITHSUNDEEP
htmlcss
Jed
Jed

Reputation: 1733

How to fix display issue of Firefox with input[type="file"] in CSS

Reading from articles, I found out that input[type="file"] have unique views across different browsers.

I'm looking for a quick fix for this issue using CSS(only if possible) because I need to adjust only the width of the element.

Here is the site (http://210.48.94.218/~printabl/contact/) I'm currently working with. If browse the page with firefox, the page view gives undesirable output.

enter image description here

Q: How can I adjust the width using CSS? Or any easiest fix for this issue.

Upvotes: 0

Views: 622

Answers (2)

Ben Racicot
Ben Racicot

Reputation: 5934

The input attributes will size the fields 

<input name="" type="text" size="10" maxlength="40" size=50>

CSS styling works as you'd expect

input[type=file] {width: 100%}

Possibly duplicate How to style an input[type=file] in css that would render crossbrowser compatible?

Upvotes: 0

The Maniac
The Maniac

Reputation: 2626

You can't reliably style file inputs with CSS since they're rendered differently across each browser.

Maybe this hack is what you're looking for: SO Question. I'm not sure how reliable it is across browsers though.

Upvotes: 1

Related Questions