SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2003
    Location
    Boston
    Posts
    71
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    problem with input type=file

    hello,
    I have a little problem, I have this form that I want to use, everything is fine except for the <input type="file"/> tag.

    I just don't understand, why the element doesn't take the css rule. The problem is that it display different in IE and Firefox.
    I like it to look they way it does in IE, that is the way I intended it to look like.

    http://www2.bc.edu/~olibar/sh2/

    HTML Code:
      <tr> 
            <td class="labelcell"><label>Upload Project Doc.:</label></td>
            <td class="fieldcell"><input name="browse" type="file" class="button" tabindex="14" title="Browse..." size="19" /></td>
          </tr>
    	   <tr> 
            <td class="labelcell"><label>Vendor Quote name:</label></td>
            <td class="fieldcell"><input name="cpassword" type="text" tabindex="15" title="Confirm Password" size="30" maxlength="20" /></td>
          </tr>
    	   <tr> 
            <td class="labelcell"><label>Quote total:</label></td>
            <td class="fieldcell"><input name="cpassword" type="text" tabindex="16" title="Confirm Password" size="20" maxlength="15" /></td>
          </tr>
    	   <tr> 
            <td class="labelcell"><label>Upload Quote Doc.:</label></td>
            <td class="fieldcell"><input name="browse" type="file" class="button" tabindex="17" title="Browse..." size="19" /></td>
          </tr>
          <tr> 
            <td>&nbsp;</td>
            <td class="fieldcell"><input name="submit" type="submit" class="button" tabindex="18" title="Submit data" value="Submit" /></td>
          </tr>
    and

    Code:
    .button {
     font: 11px Verdana, Geneva, Arial, Helvetica, sans-serif;
     background-color: #D7E5F2;
     color: #3670A7;
     margin-right: 4px;
     margin-top: 3px;
     margin-bottom: 2px;
    }
    .fieldcell {
     background-color: #F2F7FB;
     color: #000000;
     text-align: right;
     margin-right: 0px;
     padding-right: 0px;
    }
    Thank you
    Ramiro

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,549
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Form controls are notoriously difficult to style because they are seen as browser ( or windowed ) controls and some browsers will not let you change them because they form part of their interface scheme.

    You will find that some properties work and some don't and theres not a great deal you can do about it.

    For a work-a-round with file inputs have a look here.

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

    Hope that helps.

    Paul

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2003
    Location
    Boston
    Posts
    71
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you very much,

    this helps me very much.

    Ramiro


    Quote Originally Posted by Paul O'B
    Hi,

    Form controls are notoriously difficult to style because they are seen as browser ( or windowed ) controls and some browsers will not let you change them because they form part of their interface scheme.

    You will find that some properties work and some don't and theres not a great deal you can do about it.

    For a work-a-round with file inputs have a look here.

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

    Hope that helps.

    Paul


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •