This will allow you to style the Uploadify upload button. Normally this button is generated through the flash object, so it's a bit tricky replacing it with a CSS button. You have to use the proper parameters to make the flash object transparent and position a CSS button over your text while positioning the flash object over the CSS button. Here is the HTML:
<div id="uploadify" style="position: relative;">
Upload Screenshots
<div id="uploadify_button" type="button"></div>
</div>
The CSS makes #uploadify_button fill the space of #uploadify while the JavaScript parameters need to be fine tuned to fill the space.
$("#uploadify_button").uploadify({
'hideButton' : true,
'wmode' : 'transparent',
'script' : '/uploadify.php',
'folder' : '/uploads',
'multi' : true,
'width' : '140',
'height' : '25'
});
The width and height are very important here because they determine the size of the flash object. You need to adjust these values according to the text you used in your #uploadify div.
And finally the CSS is below. You style the #uploadify div any way you'd like while "#uploadify object" fills the relative space with itself so the flash object can overlay the button you created.
#uploadify {
background: #FF5500;
border-radius: 5px;
}
#uploadify:hover {
background: #B33C00;
}
#uploadify object {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 25px;
}