日历扩展器未正确显示答案

【问题标题】：Calendar Extender not displaying correctly日历扩展器未正确显示
【发布时间】：2012-08-21 23:23:23
【问题描述】：

我在我的页面上使用了一个 ajax 日历扩展器控件，虽然扩展器块显示正确，但它的内容却没有：

这是我用来将其写入页面的代码：

<table class="tblForm">
    <tr>
        <td valign="top">
            <asp:TextBox runat="server" ID="txtPickupDate" AutoPostBack="true"></asp:TextBox>
            <aj:CalendarExtender runat="server" ID="calPickup" TargetControlID="txtPickupDate" Format="yyyy-MM-dd">
            </aj:CalendarExtender>
        </td>
    </tr>
</table>

没有任何样式规则直接应用于 CalendarExtender，但我确实有这个可能相关的 css：

.tblForm
{
    display: block;
}
.tblForm td
{
    width: 245px;
    float: left;
}

有人见过这个吗？有谁知道它可能是什么？

提前感谢您的帮助！

编辑
我试过删除浮动，虽然这修复了 CalendarExtender，但它也会使容器表中的每个单元格不对齐。我还尝试将 clear: both; 设置为 CalendarExtender，但这会使它的背景消失。

【问题讨论】：

标签： asp.net-ajax calendarextender

【解决方案1】：

好的，我想通了:)

问题在于表格单元格的 CSS。修改单元格的宽度也修改了日历扩展器写入的表格中单元格的宽度。

为了解决这个问题，我删除了表格上的所有浮点数及其子元素，并声明了一个新类来设置宽度，然后我从包含日历的单元格中省略了它：

.tblForm 
{
    display: block;
}
.tblForm tr.wider td, tblForm .wider
{
    width: 245px;
}

【讨论】：

@MayankPathak 已解决，谢谢 :) 您的询问让我怀疑答案是否足够清楚...

【解决方案2】：

我在 ListView 对象内的日历扩展器上遇到了类似的问题。由于造型问题，它总是在周五和周六中断。我最终通过包装我的日历扩展器（包括文本框和图像）来解决它，并为它们分配一个覆盖我表格 css 的样式。

#calendarContainerOverride table
{
    width:0px;
    height:0px;
}

#calendarContainerOverride table tr td
{
    padding:0;
    margin:0;
}

然后在这里应用id：

<tr id="calendarContainerOverride">
  <td style="padding-top:10px">    
    <asp:TextBox ID="txtStart" runat="server" %>' />
    <asp:CalendarExtender ID="extender" runat="server" Enabled="True" TargetControlID="txtStart" PopupButtonID="imgCalendarStart" />
    <asp:Image ID="imgCalendarStart" ImageUrl="~/Images/Calendar.png" runat="server"/>
  </td>
</td>

使用这种方法，您不必更改所有表格的样式，只需专注于讨厌的日历即可。

【讨论】：