ColdFusion 9 introduced us to a built in flash based multi-file uploader, cffileupload. I just recently started using it and ran into something with it that I didn't like. The uploader has a background in it that you can't remove. When loaded the uploader looks like this...
If you notice there is a boarder around the upload control itself. If you look even more closely you will notice that it is a gradient. So, even if you set the background of the uploader to the background color of your site it would still appear. I tried several different methods using the cffileupload tag to remove it but none worked.
Then I started playing around with some css stuff. After a few trials and errors I ended up with this...
As you can see the border is gone. However, also gone, is the rounded corners. This was an acceptable compromise for me as I wanted the border gone more than I wanted rounded corners.
So how did I do it? Here is the code..
<div style="overflow: hidden; margin-left: -6; margin-top: -7px;">
<cffileupload align="center" height="350" name="multiUploader" url="UploadHandler.cfm"
width="425" maxuploadsize="999" stoponerror="false" bgcolor="0078AE" wmode="transparent" title="File Uplaoder" >
Basically, I put it in a div that acts like a mask. I then move the div up and left using negative margins to hide the border. If you use this just adjust the height and width accordingly.
Till next time,