when i use rad calander outside an asp panel every thing looks perfect, but whenever i use a radcalander inside asp panel every thing gonna be mixed up and the rad control will look like transparent with blue color, which makes the identfication of the days in the calander a reall impossible task, by the way the same holds true for other controls such as RacComboBox, regarding am using ie7.
how can i solve this issue.
13 Answers, 1 is accepted
Can you post an example where this can be reproduced?
Greetings,
Vlad
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.

Most probably RadCalendar inherits some CSS styles, which you have applied globally for <div>s, <table>s or <td>s. Please research this possibility and send us a runnable example if you still have difficulties.
Best wishes,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.

This is the asp code of one of the pages that suffer the proplem mentioned above!!
<%
@ Page Language="VB" AutoEventWireup="false" CodeFile="frmAddDems.aspx.vb" Inherits="Demand_frmAddDems" %>
<%
@ Register Assembly="RadPanelbar.Net2" Namespace="Telerik.WebControls" TagPrefix="radP" %>
<%
@ Register Assembly="RadCalendar.Net2" Namespace="Telerik.WebControls" TagPrefix="radCln" %>
<%
@ Register Assembly="RadComboBox.Net2" Namespace="Telerik.WebControls" TagPrefix="radC" %>
<%
@ Register Assembly="RadInput.Net2" Namespace="Telerik.WebControls" TagPrefix="radI" %>
<%
@ Register Assembly="RadGrid.Net2" Namespace="Telerik.WebControls" TagPrefix="radG" %>
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml" >
<
head runat="server">
<title>Adding Demand</title>
<link rel="stylesheet" type="text/css" href="~/App_Themes/StyleSheet.css" />
</
head>
<
body>
<form id="form1" runat="server">
<div style="text-align: center">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<table style="width: 591px; height: 97px">
<tr>
<td class="header" colspan="3">
<asp:Label ID="Label8" runat="server"
Text="Enregistrement d'une demande" Width="360px"></asp:Label></td>
</tr>
<tr>
<td colspan="3">
<br />
<table style="width: 512px" cellpadding="0" cellspacing="0">
<tr>
<td style="background-color: #ccffff; height: 20px; text-align: left;">
<asp:Label ID="Label2" runat="server" Font-Bold="True" Font-Italic="True" Font-Names="Verdana"
Font-Size="0.65em" Text="Client Id" Width="64px"></asp:Label></td>
<td style="text-align: left; height: 20px;">
<radI:RadNumericTextBox ID="txtCliId" runat="server" MaxLength="12" MaxValue="999999999999">
<NumberFormat DecimalDigits="0" GroupSeparator="" GroupSizes="1" />
</radI:RadNumericTextBox></td>
<td style="width: 84px; background-color: #ccffff; text-align: left">
<asp:Label ID="Label1" runat="server" Font-Names="Verdana" Font-Size="0.65em" Text="Nom Client" Font-Bold="True" Font-Italic="True"></asp:Label></td>
<td style="height: 20px; text-align: left">
<radI:RadTextBox ID="txtNomClient" runat="server" Width="240px" MaxLength="50">
</radI:RadTextBox></td>
<td style="height: 20px">
</td>
<td style="height: 20px">
</td>
</tr>
<tr>
<td style="background-color: #ccffff; text-align: left;">
<asp:Label ID="Label10" runat="server" Font-Names="Verdana" Font-Size="0.65em" Text="Contrat id" Font-Bold="True" Font-Italic="True"></asp:Label></td>
<td style="text-align: left"><radI:RadNumericTextBox ID="txtCtrId" runat="server" MaxLength="12" MaxValue="999999999999">
<NumberFormat DecimalDigits="0" GroupSeparator="" GroupSizes="1" />
</radI:RadNumericTextBox></td>
<td style="width: 84px; text-align: left; background-color: #ccffff;">
<asp:Label ID="Label3" runat="server" Font-Bold="True" Font-Italic="True" Font-Names="Verdana"
Font-Size="0.65em" Text="Contrat Ref"></asp:Label></td>
<td style="text-align: left">
<radI:RadTextBox ID="txtContrRef" runat="server" Width="136px" MaxLength="50">
</radI:RadTextBox></td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td style="background-color: #ccffff; text-align: left;">
<asp:Label ID="Label9" runat="server" Font-Bold="True" Font-Italic="True" Font-Names="Verdana"
Font-Size="0.65em" Text="Mobile Num"></asp:Label></td>
<td style="text-align: left">
<radI:RadNumericTextBox ID="txtMobileNumber" runat="server" MaxLength="6" MaxValue="999999">
<NumberFormat DecimalDigits="0" GroupSeparator="" GroupSizes="1" />
</radI:RadNumericTextBox></td>
<td style="width: 84px; text-align: left">
</td>
<td style="text-align: left">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td colspan="6" style="height: 26px; text-align: center">
</td>
</tr>
<tr>
<td colspan="6" style="text-align: center; height: 26px;">
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/App_Themes/search.png" OnClick="ImageButton1_Click" />
</td>
</tr>
</table>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="100">
<ProgressTemplate>
<asp:ImageButton ID="ImageButton2" runat="server" ImageUrl="~/App_Themes/ajax-loader.gif" /><br />
<span style="background-color: #ffff33"><em>Demande en cours de treatment</em></span>
</ProgressTemplate>
</asp:UpdateProgress>
</td>
</tr>
<tr>
<td colspan="3" rowspan="2" style="text-align: center" align="left">
<br />
<asp:Panel ID="pnlCtrGrid" runat="server" Wrap="False" Visible="False">
<asp:Label ID="lblCounter" runat="server" CssClass="lblRowsCounter" Font-Bold="False"
Font-Italic="False" Width="696px"></asp:Label>
<asp:GridView ID="GVContract" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="Contract ID" DataSourceID="DSContract" Width="696px" OnSelectedIndexChanged="GVContract_SelectedIndexChanged" CssClass="ASGRID">
<Columns>
<asp:CommandField ButtonType="Image" SelectImageUrl="~/App_Themes/blinklist_48.png"
ShowSelectButton="True" />
<asp:BoundField DataField="Contract ID" HeaderText="Contract ID" InsertVisible="False"
ReadOnly="True" SortExpression="Contract ID" />
<asp:BoundField DataField="Contract Refrence" HeaderText="Contract Refrence" SortExpression="Contract Refrence" />
<asp:BoundField DataField="Client ID" HeaderText="Client ID" SortExpression="Client ID" />
<asp:BoundField DataField="Client Name" HeaderText="Client Name" SortExpression="Client Name" />
<asp:BoundField DataField="Cell phone number" HeaderText="Cell phone number" SortExpression="Cell phone number" />
</Columns>
<SelectedRowStyle BackColor="Orange" />
</asp:GridView>
<br />
<hr style="width: 696px; height: 2px;" />
<asp:Label ID="lblInf" runat="server" CssClass="infoLabel" Visible="False" Width="288px"></asp:Label></asp:Panel>
<asp:Panel ID="pnlEdit" runat="server" Visible="False" EnableTheming="False" Wrap="False">
<table style="width: 656px; height: 112px" cellpadding="0" cellspacing="0">
<tr>
<td colspan="4" style="text-align: left">
<asp:Label ID="lblCliID" runat="server" Font-Bold="True" Font-Names="Verdana" Font-Size="0.65em"
ForeColor="#FF0000" Width="32px"></asp:Label>
<asp:Label ID="lblClieName" runat="server" Font-Bold="True" Font-Names="Verdana"
Font-Size="0.65em" ForeColor="Red" Width="264px"></asp:Label></td>
<td style="width: 136px">
</td>
<td>
</td>
</tr>
<tr>
<td colspan="5" style="text-align: left">
<asp:Label ID="lblError" runat="server" Font-Bold="True" Font-Italic="True" Font-Names="Verdana"
Font-Size="0.65em" ForeColor="#FF3333" Text="Numero deja en Roaming"
Visible="False" Width="360px"></asp:Label><br />
<asp:Label ID="lblWarning" runat="server" Font-Bold="True" Font-Italic="True" Font-Names="Verdana"
Font-Size="0.65em" ForeColor="#FF3333" Text="Incoherence entre date depart et date arrivee"
Visible="False" Width="360px"></asp:Label></td>
<td>
</td>
</tr>
<tr>
<td style="width: 57px; text-align: left; height: 30px;">
<asp:Label ID="Label4" runat="server" Font-Names="Verdana" Font-Size="0.65em" Text="Start Date: "
Width="104px" Font-Bold="True"></asp:Label></td>
<td colspan="3" style="background-color: #ccffff; text-align: left; height: 30px; width: 199px;">
<radCln:RadDateTimePicker ID="strtDateTime" runat="server" Width="168px">
<TimeView Skin="" Style="display: none;">
</TimeView>
<DateInput Skin="">
</DateInput>
</radCln:RadDateTimePicker>
</td>
<td style="width: 136px; height: 30px; text-align: left;">
<asp:Label ID="lblWarnStartDate" runat="server" ForeColor="Red" Text="*" Visible="False"></asp:Label></td>
<td style="height: 30px">
</td>
</tr>
<tr>
<td style="width: 57px; text-align: left; height: 30px;">
<asp:Label ID="Label6" runat="server" Font-Names="Verdana" Font-Size="0.65em" Text="Finish Date: "
Width="104px" Font-Bold="True"></asp:Label></td>
<td colspan="3" style="background-color: #ccffff; text-align: left; height: 30px; width: 199px;">
<radCln:RadDateTimePicker ID="endDateTime" runat="server" AutoPostBack="True" AutoPostBackControl="Both" Culture="French (France)" EnableTyping="False" Width="168px">
<TimeView Skin="" Style="display: none;" Culture="French (France)">
</TimeView>
<DateInput Skin="" AutoPostBack="True" ReadOnly="True">
</DateInput>
</radCln:RadDateTimePicker>
</td>
<td style="height: 30px; width: 136px; text-align: left;">
<asp:Label ID="lblWarnFinate" runat="server" ForeColor="Red" Text="*" Visible="False"></asp:Label></td>
<td style="height: 30px">
</td>
</tr>
<tr>
<td style="width: 57px; text-align: left">
<asp:Label ID="Label5" runat="server" Font-Names="Verdana" Font-Size="0.65em" Text="Destination: "
Width="96px" Font-Bold="True"></asp:Label></td>
<td colspan="3" style="background-color: #ccffff; text-align: left; width: 199px;">
<asp:DropDownList ID="cmbDestination" runat="server" DataSourceID="DSDestination"
DataTextField="Name" DataValueField="IdCountry" Width="176px" Font-Names="Verdana" Font-Size="0.8em">
</asp:DropDownList></td>
<td style="width: 136px">
<asp:Label ID="lblDestin" runat="server" Font-Bold="True" Font-Italic="True" Font-Names="Verdana"
Font-Size="0.65em" ForeColor="#FF3300" Text="Destination obligatoire"
Visible="False" Width="144px"></asp:Label></td>
<td>
</td>
</tr>
<tr>
<td style="width: 57px; text-align: left;">
<asp:Label ID="Label7" runat="server" Font-Names="Verdana" Font-Size="0.65em" Text="Mobile number: "
Width="128px" Font-Bold="True"></asp:Label></td>
<td colspan="3" style="background-color: #ccffff; text-align: left; width: 199px;">
<asp:Label ID="lblClNum" runat="server" Font-Names="Verdana" Font-Size="0.8em" Width="64px" Font-Bold="False"></asp:Label></td>
<td style="width: 136px">
</td>
<td>
</td>
</tr>
<tr>
<td colspan="5" style="height: 24px">
<asp:Button ID="Button1" runat="server" Height="24px" Text="Enregistrer" Width="88px" OnClick="Button1_Click" CssClass="btnBasic" />
<asp:Button ID="Button2" runat="server" Text="Retour" Width="88px" CssClass="btnBasic" OnClick="Button2_Click" /></td>
<td style="height: 24px">
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
<tr>
<td colspan="3" rowspan="2">
</td>
</tr>
<tr>
<td colspan="2">
</td>
<td colspan="1">
</td>
</tr>
</table>
<asp:SqlDataSource ID="DSContract" runat="server" ConnectionString="<%$ ConnectionStrings:myConnectionString %>"></asp:SqlDataSource>
<asp:SqlDataSource ID="DSClient" runat="server" ConnectionString="<%$ ConnectionStrings:myConnectionString %>"
SelectCommand="SELECT mytable._ID AS [Client ID], mytable._client_Description AS Name, mytable._Type_Desc AS [Client Type], mytable._date_Registration AS [Date Added] FROM mytableINNER JOIN mytable ON mytable._Client_Type = mytable._ID">
</asp:SqlDataSource>
<br />
<asp:SqlDataSource ID="DSDestination" runat="server" ConnectionString="<%$ ConnectionStrings:myConnectionString %>"
SelectCommand="SELECT IdCountry, Name FROM mytable UNION SELECT 0 AS Expr1, '' AS Expr2 FROM mytable AS mytable ORDER BY Name">
</asp:SqlDataSource>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</
body>
</
html>
The controls work correctly on my side. Most probably, the problem is caused by CSS styles in ~/App_Themes/StyleSheet.css
Sincerely yours,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.

I suggest that you try removing some controls and/or CSS files from your web application until RadCalendar starts looking as expected. Then you will know what causes the problem.
If you still have no luck with resolving the issue, please prepare a separate simple web project, which reproduces the problem, and send it attached to a new support ticket.
Best wishes,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.

I think this problem accures after updating to 2008.3.1125.35
Did you change anything by change from 2008.2.x to 2008.3.x ?
Regards Markus

No wonder it would not work :-(
NEW
/*Telerik RadCalendar Gray skin*/
table.RadCalendar_Gray
{
border-collapse:separate;
border:0;
background:#fff;
font:11px arial,tahoma,sans-serif;
width:224px;
}
OLD
/* Telerik RadCalendar Gray Skin */
.calendarWrapper_Gray
{
width:230px; /*default*/
border-collapse:separate !important;
border:1px solid #828282 !important;
background:#fff;
font:11px arial,tahoma,sans-serif;
}
Thats bad news for me :-(
Markus

Or do I have to creat a sprite image for me?
Regards Markus

In fact, what i really doupt in, is the asp panel.

Only way I overcame it was to copy my RadContols Skin Calendar CSS file into my local styles folder, renaming it and then include it in the normal way in my ASPX file.
e.g. <link href="Styles/myCalendar.css" rel="stylesheet" type="text/css" />
Hope this helps
We changed the CSS classes and optimized the rendering of RadCalendar for Q3 2008. Please refer to the following pages for more information:
http://blogs.telerik.com/dimodimov/posts/08-10-14/Optimized_Rendering_and_Skins_for_RadCalendar_for_ASP_NET_AJAX.aspx
http://www.telerik.com/help/aspnet-ajax/appearance-skin-migration.html
Markus - although the custom skin migration is mostly a find-and-replace procedure, if you have taken the embedded Gray skin and made only a few minor changes, then it will be easier for you to take the new Gray skin and customize it again, rather than migrating you custom skin.
All the best,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.