I'm just starting to use this WebDialogWindow but I can't find a way to remove the default light blue gradient background image on the Header area. What do I need to do to remove that background image and just use my own background colors? Setting the background color for the header works cause I can see the color showing on the corners of the header, but the background image is covering the whole area. I want to remove that image.
Help?
Thanks in advance!
You can try using AppStylist for ASP.NET and set your own colors.
Hi,
That is correct, you may use AppStylist to configure your own appearance of whole control or for several controls on page.
The appearance of WebDialogWindow is based on css classes located at file similar to WebSite\ig_res\Default\ig_dialogwindow.css. So, you may modify values there and that will affect all controls in application.
WebDialogWindow also exposes public properties for all its css classes. Particularly appearance related to header is defined by properties in RoundedCorners (area related to rounded images) and in Header (whole header and its child elements) properties of WebDialogWindow.
To replace only background and keep the rest unchanged, you may use following:
<style type="text/css"> .myBackColor{background:#C0C0C0;}</style>
<ig:WebDialogWindow ID="WebDialogWindow1" runat="server" Height="148px" Width="428px"> <RoundedCorners HeaderContentCssClass="myBackColor" HeaderCornerLeftCssClass="myBackColor" HeaderCornerRightCssClass="myBackColor" /></ig:WebDialogWindow>
You also may set transparent background to areas used for rounded corners and define appearance of whole header by following:
<style type="text/css"> .myHeaderCorners{background:transparent;} .myHeader { background:#C0C0C0; border-right:1px solid black; border-top:1px solid black; border-left:1px solid black; }</style>
<ig:WebDialogWindow ID="WebDialogWindow1" runat="server" Height="148px" Width="428px"> <RoundedCorners HeaderContentCssClass="myHeaderCorners" HeaderCornerLeftCssClass="myHeaderCorners" HeaderCornerRightCssClass="myHeaderCorners" /> <Header CssClass="myHeader"></Header></ig:WebDialogWindow>