Date Header Alignment

4 posts, 0 answers
  1. Chris
    Chris avatar
    3 posts
    Member since:
    Jan 2009

    Posted 03 Mar 2009 Link to this post

    Hi there
    Is it possible to align the date part of the header of the scheduler control?
    I have removed all controls in the header except the date part and wish to align this on the right
    I have tried some styles as well


    <style type="text/css">   
    div.RadScheduler .rsHeader   
    text-align: right;   
    padding-right: 0px;   






  2. Peter
    Peter avatar
    6637 posts

    Posted 04 Mar 2009 Link to this post

    Hello Chris,

    I managed to right-align the header date relatively easy, so please let me know if I am missing somethig. Try the following:
     <style type="text/css">  
        .rsHeader h2  

    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. DevCraft R3 2016 release webinar banner
  4. Chan
    Chan avatar
    14 posts
    Member since:
    Nov 2012

    Posted 16 Jul 2013 Link to this post

    Helo !
    I need to rearrange controls of radscheduler(ASP AJAX) as per following plan :

    1. Date Navigation arrow buttons right (top-right) aligned in scheduler.
    2. Multidayview, dayview, weekview, monthview, timelineview center (top-center) aligned in scheduler
    5. MultidayView - loading scheduler in such way that if last week of scheduler crossing one month it should not show the next month for example : if last week having days from september & october , display only dates from september not from october
    or draw an arrow representing two month separately for clarity. like, blue arrow for september and green arrow stands for october

    thanx for any help.


  5. Boyan Dimitrov
    Boyan Dimitrov avatar
    1728 posts

    Posted 19 Jul 2013 Link to this post


    An easy and convenient way of achieving such appearance modification would be to use the following styles:
    <style type="text/css">
            /*move the navigation arrow buttons to the right side of the scheduler header*/
            html .RadScheduler .rsHeader p {
            float: right;
            padding-right: 5px;
            /*position the different views in the center of the scheduler header*/
            html .RadScheduler .rsHeader ul {
                padding-right: 40%;

    I am afraid that such modification as shown in the provided image is not supported by the RadScheduler out of the box. Alternative way of achieving similar scenario would be to use the RadScheduler TimeSlotCreated server-side event handler to apply desired colors for different months. The code snippet below demonstrating how you can apply red color for the July time slots and Green color for the August time slots.
    //code behind
    protected void RadScheduler1_TimeSlotCreated(object sender, TimeSlotCreatedEventArgs e)
            if (e.TimeSlot.Start.Month == 7)
                e.TimeSlot.Control.BackColor = System.Drawing.Color.Red;
            else if (e.TimeSlot.Start.Month == 8)
                 e.TimeSlot.Control.BackColor = System.Drawing.Color.Green;

    Here you may find our RadScheduler TimeSlot customization demo that might be helpful for your scenario requirement.

    Boyan Dimitrov
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top