You can change the look and feel of
FileUpload using the
FileUpload CssClass property.
FileUpload has a predefined set of CSS classes that can be overridden.
It has a default style ("obout_ajax__fileupload") which is embedded as a WebResource and is a part of the Obout.Ajax.UI assembly that has styles set for all the sub-classes.
You can find the default styles in the
Suite in the "oboutSuite_3.5\FileUpload\styles\Default.css" file.
To customize the same the user would have to set the
CssClass property to the name of the CSS style and define
the styles for the individual classes so that the various elements in a
FileUpload control can be styled accordingly.
For example if the
CssClass property was set to "MyFileUpload" this is how the css to style the
FileUpload container would look:
/* the control's container */
div.MyFileUpload
{
border:
1px solid black;
padding:
2px;
background-color:
#E0E0E0;
border-radius:
5px;
-moz-border-radius:
5px;
-webkit-border-radius:
5px;
text-align:
left;
}
You can find the customized styles in the
Suite in the "oboutSuite_3.5\FileUpload\styles\MyStyles.css" file.
Here you can see code how to implement customized styles:
<link href="styles/MyStyles.css" rel="Stylesheet" type="text/css" />
…
<obout:FileUpload runat="server" CssClass="MyFileUpload" />