CSS问题 - ASP.NET日历选择器 [英] CSS Issue - ASP.NET Calendar picker

问题描述

修改结果
随着下面的答案之一，我是能够解决此问题的一个表中的呈现。我仍然看到我的列表视图中的这一问题。我试过这个CSS为ListView，但还没有纠正的问题。

  / *修正日历表* /
.DateTime_Edit
{
    空格：NOWRAP;
}
.DateTime_Edit表
{
    边框：实心0 #FFFFFF;
    宽度：0;
    高度：0;
    填充：0;
    保证金：0;
}
.DateTime_Edit表TR TD
{
    边框：实心0 #FFFFFF;
    填充：0;
    保证金：0;
}
/ * LISTVIEW不灵* /
.DateTime_Edit table.listview
    {
        边框：实心0 #FFFFFF;
        宽度：0;
        高度：0;
        填充：0;
        保证金：0;
    }
    .DateTime table.listview TR TD
    {
        边框：实心0 #FFFFFF;
        填充：0;
        保证金：0;
    }
 

---

在一个ListView 结果

中的表结果

---

现场模板定义：

 ＆LT;％@控制语言=C＃codeBehind =DateAjaxCalendar_Edit.ascx.cs继承=WarehouseLogging.DateAjaxCalendar_EditField％GT;
＆LT; D​​IV CLASS =DateTime_Edit＆GT;
＆LT; ASP：文本框ID =TextBox1的=服务器文本='＆LT;％＃FieldValueEditString％GT;'的CssClass =droplist＆GT;＆LT; / ASP：文本框＆GT;
＆LT; ASP：图像=服务器的CssClass =日历图标ID =imgCalendar1的ImageUrl =〜/图片/ calendar.gif/＆GT;
＆LT; ajaxToolkit：CalendarExtender ID =CalendarExtender1=服务器PopupButtonID =imgCalendar1
    的TargetControlID =TextBox1中的CssClass =custcal1＆GT;
＆LT; / ajaxToolkit：CalendarExtender＆GT;
＆LT; ajaxToolkit：FilteredTextBoxExtender ID =fltrTextBox1=服务器的TargetControlID =TextBox1的
    过滤式=自定义，数字ValidChars =/＆GT;
＆LT; / ajaxToolkit：FilteredTextBoxExtender＆GT;
＆LT; ASP：的RequiredFieldValidator =服务器ID =RequiredFieldValidator1的CssClass =droplist
    的ControlToValidate =TextBox1的显示=动态启用=FALSE/＆GT;
＆LT; ASP：DynamicValidator =服务器ID =DynamicValidator1的CssClass =droplist的ControlToValidate =TextBox1的
    显示=动态/＆GT;
＆LT; / DIV＆GT;
 

解决方案

另一种解决方案是覆盖这些风格与另一个名为风格。新的风格，将需要后出现上述表的样式，.css文件本身。 （precedence对CSS的顺序是它出现在.css文件...）具有特定样式的控制，将美元，在未来做同样的事情p $ pvent其他样式。

我写了这个风格，把它放在了的site.css文件的末尾并包裹了我的整个DateTime_EditFieldTemplate Contorl它：

  .DateTime_Edit
{
    空格：NOWRAP重要;！
}
.DateTime_Edit表
{
    边框：实心0 #FFFFFF重要;！
    宽度：0重要;
    身高：0重要;
    填充：0重要;
    保证金：0重要;
}
.DateTime_Edit表TR TD
{
    边框：实心0 #FFFFFF重要;！
    背景颜色：#FFFFFF重要;
    填充：0重要;
    保证金：0重要;
}
 

编辑：
增加的背景色为TD。
新增！重要的是一切（可能不需要）

希望默认的site.css文件将在以后的版本更新。

EDIT
With one of the below answers, I was able to correct this issue for the rendering within a table. I'm still seeing this issue within my ListViews. I've tried this CSS for the ListView, but it has not corrected the issue.

/* FIX FOR CALENDAR IN TABLE */
.DateTime_Edit
{
    white-space: nowrap;
}
.DateTime_Edit table
{
    border: solid 0 #FFFFFF;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
}
.DateTime_Edit table tr td
{
    border: solid 0 #FFFFFF;
    padding: 0;
    margin: 0;
}
/* LISTVIEW, NOT WORKING */    
.DateTime_Edit table.listview
    {
        border: solid 0 #FFFFFF;
        width: 0;
        height: 0;
        padding: 0;
        margin: 0;  
    }
    .DateTime table.listview tr td
    {
        border: solid 0 #FFFFFF;
        padding: 0;
        margin: 0;  
    }

---

WITHIN A LISTVIEW
WITHIN A TABLE

---

Field Template Definition:

<%@ Control Language="C#" CodeBehind="DateAjaxCalendar_Edit.ascx.cs" Inherits="WarehouseLogging.DateAjaxCalendar_EditField" %>
<div class="DateTime_Edit">
<asp:TextBox ID="TextBox1" runat="server" Text='<%# FieldValueEditString %>' CssClass="droplist"></asp:TextBox>
<asp:Image runat="Server" CssClass="CalendarIcon" ID="imgCalendar1" ImageUrl="~/Images/calendar.gif" />
<ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" PopupButtonID="imgCalendar1"
    TargetControlID="TextBox1" CssClass="custcal1">
</ajaxToolkit:CalendarExtender>
<ajaxToolkit:FilteredTextBoxExtender ID="fltrTextBox1" runat="server" TargetControlID="TextBox1"
    FilterType="Custom, Numbers" ValidChars="/">
</ajaxToolkit:FilteredTextBoxExtender>
<asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" CssClass="droplist"
    ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:DynamicValidator runat="server" ID="DynamicValidator1" CssClass="droplist" ControlToValidate="TextBox1"
    Display="Dynamic" />
</div>

解决方案

Another solution is to override those styles with another named style. The new style would need to appear after the style for the table noted above, within the .css file itself. (order of precedence for css is where it appears in the .css file...) Having a specific style for that control would prevent other styles from doing the same thing in the future.

I wrote this style, placed it at the end of the Site.css file and wrapped my entire "DateTime_Edit" FieldTemplate Contorl in it:

.DateTime_Edit
{
    white-space: nowrap !important;
}
.DateTime_Edit table
{
    border: solid 0 #FFFFFF !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}
.DateTime_Edit table tr td
{
    border: solid 0 #FFFFFF !important;
    background-color: #FFFFFF !important;
    padding: 0 !important;
    margin: 0 !important;
}

Edit: Added background-color to the 'td'. Added !important to everything (may not be needed)

Hopefully the default Site.css file will be updated in subsequent releases.

这篇关于CSS问题 - ASP.NET日历选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！