jQuery and ASP.NET

May 26, 2009

Changing the Background Color of an ASP.NET AJAX CalendarExtender




By default, an ASP.NET AJAX CalendarExtender looks similar to the following:



However if you want to change the header/background color of an ASP.NET AJAX CalendarExtender, then here's how to do it using CSS.


<head runat="server">


    <title></title>


    <style type="text/css">


        .cal .ajax__calendar_header


        {


              background-color: Silver;


        }


        .cal .ajax__calendar_container


        {


                background-color: Gray;


        }        


    </style>


</head>


<body>


    <form id="form1" runat="server">


    <div>


        <asp:ScriptManager ID="ScriptManager1" runat="server">


        </asp:ScriptManager>


        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>


        <cc1:CalendarExtender ID="CalendarExtender1" runat="server" CssClass="cal"


        TargetControlID="TextBox1" >


        </cc1:CalendarExtender>


    </div>


    </form>


</body>


</html>




After applying the CSS, the CalendarExtender will look similar to the following:



'Like' us on our FaceBook page if you find this blog useful. Thanks!


Did you like this post?
kick it on DotNetKicks.com Save on Delicious
subscribe via rss subscribe via e-mail
print this post follow me on twitter


About The Author

Suprotim Agarwal, ASP.NET Architecture MVP works as an Architect Consultant and provides consultancy on how to design and develop Web applications.

Suprotim is also the founder and primary contributor to DevCurry, DotNetCurry and SQLServerCurry. He has also written an EBook 51 Recipes using jQuery with ASP.NET Controls.

Follow him on twitter @suprotimagarwal

comments

4 Responses to "Changing the Background Color of an ASP.NET AJAX CalendarExtender"
  1. Donald W said...
    May 26, 2009 9:50 AM

    I wonder why has MS made it so difficult to change the backcolor. Is there any other simpler way?

  2. Nil said...
    May 27, 2009 3:15 AM

    Nice Blog!!

    Why don't you use Microsoft Live Writer that will keep your code readable..you just have to use plugin for that..try it out..

  3. Suprotim Agarwal said...
    May 27, 2009 11:21 AM

    Nil, thanks for your suggestion. I did try that sometime back but I remember the layout getting distorted in mozilla.

    Are you using it? I will give it a try again. To be honest, I am currently using a CopyAsHtml Visual Studio pluging that formats the code as HTML. It's too cumbersome.

  4. Amit said...
    February 9, 2012 12:09 AM

    SyntaxHighlighter is not a bad option either

 

Copyright © 2009-2011 All Rights Reserved for DevCurry.com by Suprotim Agarwal | Terms and Conditions