ASP.NET AJAX calendarExtendar – How to fix problems with days (saturday) being cut / chopped off
If you can’t see the Saturday column on your calendar its because of the padding applied throughout your document. You may already of realised this was the problem and not managed to track down the padding.
The best and easiest solution is to use a custom css class to over-ride the default like below and use the following to clear the padding and margins:
.cal_Theme1 * {padding:0px;margin:0px;}
The styles below can go in a linked stylesheet of in your document head.
/* Calendar css */
.cal_Theme1 * {padding:0px;margin:0px;}
.cal_Theme1 .ajax__calendar_container {background-color: #e2e2e2;width:192px;border:solid 1px #cccccc;}
.cal_Theme1 .ajax__calendar_header{background-color: #ffffff; margin-bottom: 4px;}
.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev{color: #004080; padding-top: 3px;}
.cal_Theme1 .ajax__calendar_body{background-color: #e9e9e9; border: solid 1px #cccccc;}
.cal_Theme1 .ajax__calendar_dayname{text-align:center; font-weight:bold; margin-bottom: 4px; margin-top: 2px;}
.cal_Theme1 .ajax__calendar_day{text-align:center;}
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_month,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_year,
.cal_Theme1 .ajax__calendar_active{color: #004080; font-weight:bold; background-color: #ffffff;}
.cal_Theme1 .ajax__calendar_today{font-weight:bold;}
.cal_Theme1 .ajax__calendar_other,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_today,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_title{color: #bbbbbb;}
ASP Code:
this is how you reference the style you created above in the asp page
<asp:TextBox ID=”F1_I2″ runat=”server” CssClass=”bigInput”>
</asp:TextBox>
<cc1:CalendarExtender ID=”F1_I2_CalendarExtender” CssClass=”cal_Theme1″ runat=”server” TargetControlID=”F1_I2″ Format=”dd/MM/yyyy”>
</cc1:CalendarExtender>