I've put together a basic combination but it doesn't work as expected, my calendars are not Poping beyond the edges of my collapse panel, and I can't find a reason for it. See the photo and aspx file, thanks. SM.
and the ASP
<div class="collapsePanelMaster">
<asp:Panel ID="TitlePanel" runat="server" CssClass="collapsePanelHeader">
<div class="collapsePanelBody">
<div class="collapsePanelImage">
<asp:ImageButton ID="ImageCPE" runat="server" ImageAlign="Middle" ImageUrl="~/App_Themes/bssprogram/images/collapseArrows.png" AlternateText="(Show Details)"/>
</div>
<div class="collapsePanelText">
<div class="collapsePanelTitle">Report Designer</div>
<div class="collapsePanelStatus">
<asp:Label ID="lblCPE" runat="server">(Show Details)</asp:Label>
</div>
</div>
</div>
</asp:Panel>
<asp:Panel ID="InputPanel" runat="server" CssClass="collapsePanel" >
<h3 align="center">Root Cause for Top 10 Hazards by Percentage</h3>
<center>
<table cellpadding="2px">
<tr>
<td align="right">Company:</td>
<td align="left" colspan="2">
<asp:DropDownList ID="ddlCompany" SkinID="rwDDL" runat="server">
</asp:DropDownList>
<asp:CompareValidator ID="cvCompany" runat="server" ControlToValidate="ddlCompany"
Display="Dynamic" ErrorMessage="You must select a company name" Operator="NotEqual"
ValueToCompare="-1">*</asp:CompareValidator>
</td>
</tr>
<tr>
<td align="right">Start Date:</td>
<td align="left">
<asp:TextBox ID="StartDate" runat="server" MaxLength="10" OnTextChanged="StartDate_TextChanged" ValidationGroup="EditGroup" Width="100px"></asp:TextBox>
<asp:Image ID="DisplayStartDateCalendar" runat="server" Height="17" Width="16" ImageUrl="~/App_Themes/bssprogram/images/calendar.jpg"/>
<asp:RequiredFieldValidator ID="StartDateValidator" runat="server" ControlToValidate="StartDate" ErrorMessage="Start Date is required" ValidationGroup="DateGroup">*</asp:RequiredFieldValidator>
<asp:RangeValidator ID="StartDateRangeValidator" runat="server" ControlToValidate="StartDate"
CultureInvariantValues="True" ErrorMessage="Start Date must be a date format of {mm/dd/yyyy}"
MaximumValue="3001/1/1" MinimumValue="2007/1/1" SetFocusOnError="True" Type="Date"
ValidationGroup="EditGroup">*</asp:RangeValidator>
</td>
</tr>
<tr>
<td align="right">End Date:</td>
<td align="left">
<asp:TextBox ID="EndDate" runat="server" MaxLength="10" OnTextChanged="EndDate_TextChanged" ValidationGroup="EditGroup" Width="100px"></asp:TextBox>
<asp:Image ID="DisplayEndDateCalendar" runat="server" Height="17" Width="16" ImageUrl="~/App_Themes/bssprogram/images/calendar.jpg"/>
<asp:RequiredFieldValidator ID="EndDateValidator" runat="server" ControlToValidate="EndDate" ErrorMessage="End Date is required" ValidationGroup="DateGroup">*</asp:RequiredFieldValidator>
<asp:RangeValidator ID="EndDateRangeValidator" runat="server" ControlToValidate="EndDate"
CultureInvariantValues="True" ErrorMessage="End Date must be a date format of {mm/dd/yyyy}"
MaximumValue="3001/1/1" MinimumValue="2007/1/1" SetFocusOnError="True" Type="Date"
ValidationGroup="EditGroup">*</asp:RangeValidator>
</td>
</tr>
</table>
<div class="demoheading">PopupControl Demonstration</div>
Enter date for new reminder:
<asp:TextBox ID="DateTextBox" runat="server" Width="80" autocomplete="off" /><br /><br />
<asp:Panel ID="Panel1" runat="server" CssClass="popupControl" style="z-index: 1000">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<center>
<asp:Calendar ID="Calendar1" runat="server" Width="160px" DayNameFormat="Shortest"
BackColor="White" BorderColor="#999999" CellPadding="1" Font-Names="Verdana" style="z-index: 1001"
Font-Size="8pt" ForeColor="Black" OnSelectionChanged="Calendar1_SelectionChanged">
<SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />
<TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />
<SelectorStyle BackColor="#CCCCCC" />
<WeekendDayStyle BackColor="#FFFFCC" />
<OtherMonthDayStyle ForeColor="#808080" />
<NextPrevStyle VerticalAlign="Bottom" />
<DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />
<TitleStyle BackColor="#999999" Font-Size="7pt" BorderColor="Black" Font-Bold="True" />
</asp:Calendar>
</center>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<cc1:PopupControlExtender ID="PopupControlExtender1" runat="server"
TargetControlID="DateTextBox"
PopupControlID="Panel1"
Position="Bottom" />
<br />
<asp:ValidationSummary ID="ValidationSummary1" runat="server" />
<div id="lbPanelButton">
<asp:LinkButton ID="LbnContinue" runat="server" Text="Display Results"
OnClick="LbnContinue_Click"></asp:LinkButton>
</div>
<br />
</center>
<cc1:CalendarExtender ID="CalendarExtender1" runat="server"
TargetControlID="StartDate"
CssClass="myCalendarClass"
Format="MM/dd/yyyy" />
<cc1:CalendarExtender ID="CalendarExtender2" runat="server"
TargetControlID="EndDate"
CssClass="myCalendarClass"
Format="MM/dd/yyyy" />
</asp:Panel>
<cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="Server"
TargetControlID="InputPanel"
ExpandControlID="TitlePanel"
CollapseControlID="TitlePanel"
Collapsed="false"
TextLabelID="lblCPE"
ImageControlID="ImageCPE"
ExpandedText="(Hide Details)"
CollapsedText="(Show Details)"
ExpandedImage="~/App_Themes/bssprogram/images/expandArrows.png"
CollapsedImage="~/App_Themes/bssprogram/images/collapseArrows.png"
SuppressPostBack="true"
SkinID="CollapsiblePanelReports" />
</div>