DateTimePicker embeds all styles in the HTML document

2 posts, 0 answers
  1. Martin
    Martin avatar
    199 posts
    Member since:
    Oct 2005

    Posted 09 Dec 2008 Link to this post

    Hi, I just discovered that the RadDateTimePicker control embeds all its CSS styles (almost 500 lines of code) inside the generated HTML document (see below for an example). Even worse, if I add a second RadDateTimePicker to the same page, the styles appear twice in the resulting HTML document.

    Why does this happen and can it be prevented?

    Regards,
    Martin

    Example HTML document (excerpts) from a page with just one RadDateTimePicker on it:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
     
    .... 
     
    <body>     
     
    ... 
     
    <style type='text/css'>/*Telerik RadCalendar Default skin*/ 
     
    table.RadCalendar_Default 
        border-collapse:separate; 
        border:0; 
        background:#fff; 
        font:11px arial,tahoma,sans-serif; 
        width:220px; 
     
    /*titlebar*/ 
     
    .RadCalendar_Default .rcTitlebar 
        width:100%; 
        border:1px solid; 
        border-color:#101010 #090909 #171717; 
        padding:0; 
        background:#444 url('/TelerikTests2008Q3/WebResource.axd?d=Yi4p-ByImfnF95uhANtR9571aHjWR6sUWxK-qQw1ArGCDBP1B9AVIvBl555xdCsPLhCWnR8j0cUgV7lipYaYDIf33gEKSNwhTLLm5IXyj7M1&t=633631346240000000') 0 -500px repeat-x; 
        color:#fff; 
     
    .RadCalendar_Default .rcTitlebar table 
        width:100%; 
        border-collapse:separate; 
        border:0; 
        border-bottom:1px solid #3d3d3d; 
        font:16px/32px arial,tahoma,sans-serif; 
     
    .RadCalendar_Default .rcTitlebar td 
        border:0; 
        padding:2px 0 0; 
        text-align:center; 
        vertical-align:middle; 
     
    .RadCalendar_Default .rcTitlebar .rcTitle 
        width:100%; 
        cursor:pointer; 
     
    .RadCalendar_Default .rcTitlebar .rcPrev, 
    .RadCalendar_Default .rcTitlebar .rcNext, 
    .RadCalendar_Default .rcTitlebar .rcFastPrev, 
    .RadCalendar_Default .rcTitlebar .rcFastNext 
        display:block; 
        width:15px; 
        height:15px; 
        overflow:hidden; 
        margin:0 3px; 
        background:transparent url('/TelerikTests2008Q3/WebResource.axd?d=Yi4p-ByImfnF95uhANtR9571aHjWR6sUWxK-qQw1ArGCDBP1B9AVIvBl555xdCsPLhCWnR8j0cUgV7lipYaYDIf33gEKSNwhTLLm5IXyj7M1&t=633631346240000000') no-repeat; 
        text-indent:-1111px; 
        text-decoration:none; 
        color:#ccc; 
     
    .RadCalendar_Default .rcTitlebar .rcPrev 
        background-position:4px -48px; 
     
    .RadCalendar_Default .rcTitlebar .rcNext 
        background-position:4px -98px; 
     
    .RadCalendar_Default .rcTitlebar .rcFastPrev 
        margin-left:5px; 
        background-position:2px 2px; 
     
    .RadCalendar_Default .rcTitlebar .rcFastNext 
        margin-right:5px; 
        background-position:2px -148px; 
     
    .RadCalendar_Default .rcMain 
        width:100%; 
        border:1px solid #222; 
        border-top:0; 
        padding:0; 
     
    .RadCalendar_Default .rcMainTable 
        border-collapse:separate; 
        border:0; 
        width:89%; 
        margin:5px 13px 6px 11px; 
        font:11px/16px arial,tahoma,sans-serif; 
     
    /*header, footer*/ 
     
    .RadCalendar_Default .rcHeader, 
    .RadCalendar_Default .rcFooter 
        border:1px solid #222; 
        border-top:0; 
        padding:0; 
     
    ... (this goes on for more that 400 lines) 
     
    </style> 
     
    </body></html>  


  2. Dimo
    Admin
    Dimo avatar
    8478 posts

    Posted 10 Dec 2008 Link to this post

    Hello Martin,

    Please refer to the following forum thread and contact us via a support ticket in case you need a non-trial hotfix.

    http://www.telerik.com/community/forums/aspnet-ajax/calendar/invalid-w3c-validation-for-radcalendar.aspx

    Best wishes,
    Dimo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top