Jump to:
| Project: | Webform |
| Version: | 7.x-3.13 |
| Component: | Miscellaneous |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | closed (fixed) |
Issue Summary
I'm using Webform 3.13 on a Drupal 7.9 install, and I can't figure out how to style the file input type. I've been able to style the other fields through normal css practices (seeing what the HTML entities are named and styling those), but the file input type has an area for the filename and a "Browse" button that don't seem to be in the end HTML, so I don't know how to access them for theming.
I've looked through the template files in the webform module, and while I did find a file.inc, I didn't see anything that pertained to how it displayed (though my understanding of PHP is still rather weak). I read through the theming txt file, and didn't find anything useful there either.
Here's the code that's being generated:
<div id="webform-component-upload-before-image" class="form-item webform-component webform-component-file webform-container-inline">
<label for="edit-submitted-upload-before-image">Upload Before Photo </label>
<input id="edit-upload-before-image" class="form-file" type="file" size="12" name="files[upload_before_image]">
<input type="hidden" value="" name="submitted[upload_before_image][_fid]">
<input type="hidden" name="submitted[upload_before_image][_old]">
</div>And here's what the output is:link to image
I need to style the button and the file-text areas separately.
Can anyone point me in the right direction? Thanks!
Comments
#1
See http://www.quirksmode.org/dom/inputfile.html
Of importance, the file component has been entirely rewritten in the D7 version of the module to use Drupal 7's new "managed_file" element, which gives us AJAX-uploading and progress bars (just like Field module's File fields). That new field will be in the 3.16 version of the module. But even after that update, the upload element is still going to pose the same problem because you have limited CSS control over file elements no matter what.
#2