homepage Welcome to WebmasterWorld Guest from 54.198.148.191
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe and Support WebmasterWorld
Home / Forums Index / Browsers / Firefox Browser Usage and Support
Forum Library, Charter, Moderators: incrediBILL

Firefox Browser Usage and Support Forum

    
ASP:FileUpload styling issue
LouiseMarie




msg:4174602
 10:17 am on Jul 22, 2010 (gmt 0)

I have a form that I'm trying to style and all the css classes that i've set up work on all the input boxes except for ASP:FileUpload text boxes and buttons. It seems to pick up the styling border properties in IE but not on Firefox and the buttons display differently.

The idea is to get the input to look the same as it does in IE in Firefox. Can anyone help?

In order to see the site please run it in both IE and Firefox to see the difference:
www.a2directory.com/contact.aspx

thanks in advance

 

tedster




msg:4174778
 4:20 pm on Jul 22, 2010 (gmt 0)

I'm not seeing any differences with Firefox 3.6.6

How about a couple code snippets? the CSS rules for the class in question, and HTML for the elements your styling within the form tag.

LouiseMarie




msg:4175231
 8:39 am on Jul 23, 2010 (gmt 0)

thanks for looking at this for me:

This is the html:-

<div style="display:inline-block;">
<asp:FileUpload ID="FileUpload1" runat="server" Cssclass="input" style="width:500px;margin-top:3px;" TabIndex="11" /><br /> <asp:CustomValidator ID="ValidFileExts" ControlToValidate="FileUpload1" runat="server" ErrorMessage="Invalid File Extension" ClientValidationFunction="ValidateFileExts" ForeColor="#e79778" OnServerValidate="ValidateFilExts_ServerValidate"></asp:CustomValidator></div>

css class:-

.input {height:18px; background-color:#ffffff; padding:2px 0 0 5px; font-size:12px; color:#313131; border:1px solid #787878;}

I can't actually see a part in the code that allows me to control the browse button with a different class.

I've checked the version of firefox we are running our servers and it's 3.5.11.

I've taken some screenshots to show you what it looks like.
[rapidshare.com...]

thanks for your help

Fotiman




msg:4175338
 1:32 pm on Jul 23, 2010 (gmt 0)

Note, that is not the HTML, that is the ASP code. After your page has been displayed, do View > Source and that will show you the actual HTML. You will likely see an <input type="file" ...> in the output.

Styling an input type="file" element has been notoriously problematic. If you do a search for "style file input" you will find more information. Safari, for example, has a totally different model (there is not text box displayed at all). There are some workarounds that require a bit of CSS and JavaScript, but I've never tried it myself, so I will defer to what you can find by searching.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Browsers / Firefox Browser Usage and Support
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved