超大日历延长器

Question

如何调整ajax控件工具包的calendarextender的大小，使其触摸友好，我已成功修改css属性，但在选择月份或年份时，月份（或年份）与日期重叠，并且在选择后不会崩溃。

这是我到目前为止使用的CSS：

.ajax__calendar_container {padding:4px;position:absolute;cursor:default;width:450px;font-size:28px;text-align:center;font-family:tahoma,verdana,黑体； z 索引：10000； } .ajax__calendar_body {高度：360px；宽度：450px；位置：相对；溢出：隐藏；边距：自动；} .ajax__calendar_days {顶部：0px；左侧：0px；高度：360px；宽度：450px；位置：绝对；文本对齐：中心；边距：自动；可见性：可见；} .ajax__calendar_months{顶部：0px;左侧：0px;宽度：450px;位置：绝对;文本对齐：中心;边距：0 0 -5px 0;内边距：0 0 1px 0；溢出：隐藏；背景颜色：#ffffff；} .ajax__calendar_years {顶部：0px；左：0px；宽度：450px；位置：绝对；文本对齐：中心；边距：-10px；溢出：隐藏；}

.ajax__calendar_container 表{字体大小：32px；} .ajax__calendar_header {高度：40px;宽度：100％; z 索引：1000；} .ajax__calendar_prev {光标：指针；宽度：45px；高度：45px；浮动：左；背景重复：无重复；背景位置：50% 50%；背景图像：url(<%=WebResource("AjaxControlToolkit .Calendar.arrow-left.gif")%>);背景颜色：#D3DEEF;} .ajax__calendar_next {光标：指针；宽度：45px；高度：45px；浮动：右；背景重复：无重复；背景位置：50% 50%；背景图像：url(<%=WebResource("AjaxControlToolkit .Calendar.arrow-right.gif")%>);背景颜色：#D3DEEF;} .ajax__calendar_title {光标：指针；字体粗细：粗体；} .ajax__calendar_footer {高度：33px;} .ajax__calendar_today {光标：指针；padding-top：3px；} .ajax__calendar_dayname {高度：28px;宽度：34px;文本对齐：右;填充：0 4px -10px 0;} .ajax__calendar_day {字体大小：20px;高度：51px;宽度：54px;文本对齐：右;填充：0 4px;光标：指针;} .ajax__calendar_month {字体大小：18px；高度：45px；宽度：60px；文本对齐：中心；光标：指针；溢出：隐藏；垂直对齐：中间；边距：-1px 0 1px 0；} .ajax__calendar_year {字体大小：18px；高度：46px；宽度：60px；文本对齐：中心；光标：指针；溢出：隐藏；垂直对齐：中间;}

.ajax_日历.ajax_calendar_container {边框：1px实体#646464;背景颜色：#ffffff;颜色：#000000;} .ajax_日历 .ajax_calendar_footer {border-top:1pxsolid #f5f5f5;} .ajax_日历 .ajax_calendar_dayname {border-bottom:1pxsolid #f5f5f5;} .ajax_日历 .ajax_calendar_day {border:1pxsolid #D3DEEF;} .ajax_日历 .ajax_calendar_month {边框：1px 实心#D3DEEF;背景颜色：#ffffff;} .ajax_日历 .ajax_calendar_year {边框：1px 实心#D3DEEF;背景颜色：#ffffff;}

.ajax_日历 .ajax_calendar_active .ajax__calendar_day {背景颜色：# edf9ff;边框颜色:#0066cc;颜色:#0066cc;} .ajax_日历 .ajax_calendar_active .ajax__calendar_month {背景颜色：#edf9ff;边框颜色：#0066cc;颜色：#0066cc;} .ajax_日历 .ajax_calendar_active .ajax__calendar_year {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;}

.ajax_日历 .ajax_calendar_other 。 ajax__calendar_day {背景颜色：#ffffff;边框颜色：#ffffff;颜色：#646464;} .ajax_日历 .ajax_calendar_other .ajax__calendar_year {background-color:#ffffff;border-color:#ffffff;color:#646464;}

.ajax_日历 .ajax_calendar_hover 。 ajax__calendar_day {背景颜色：#edf9ff;边框颜色：#daf2fc;颜色：#0066cc;} .ajax_日历 .ajax_calendar_hover .ajax__calendar_month {背景颜色：#edf9ff;边框颜色：#daf2fc;颜色：#0066cc;} .ajax_日历 .ajax_calendar_hover .ajax__calendar_year {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;}

.ajax_日历 .ajax_calendar_hover 。 ajax__calendar_title {颜色：#0066cc;} .ajax_calendar .ajax_calendar_hover .ajax__calendar_today {color:#0066cc;}

通过这种CSS样式，我可以避免重叠，但是月份和年份不再足够大，并且不会填满整个屏幕。有人有这方面的经验吗？

Answer 1

我自己也有一个非常相似的问题，最终发现更多的是一种黑客而不是解决方案。但它工作得很好，不会给我带来任何问题：

由于我无法放大日历，所以我缩小了其他所有内容并更改了页面的缩放属性，以开始用户放大到足以使日历足够大。

请参阅无需放大即可显示适合移动设备的网页< /a> 获取有关设置初始缩放的帮助。另外，我发现，如果您使用“是的，您实际上键入”设备宽度”，日历通常足够大（在我看来）

<meta name="viewport" content="width = device-width" />

，这将询问查看页面的设备的宽度并使用它。