Home / Community & Support / Knowledge Base / RadControls for ASP.NET and ASP.NET AJAX / Scheduler / Auto expand the height of the appointment to accomodate the entire subject in Month view

Auto expand the height of the appointment to accomodate the entire subject in Month view

Article Info

Rating: 5

Article information

Article relates to

RadScheduler Q1 2010     

Created by

 Peter, Telerik

Last modified

 Aug 26, 2010

Last modified by

 Veronica, Telerik

HOW TO

Auto expand the height of the appointment to accomodate the entire subject in Month view



DESCRIPTION

You can insert appointment with any subject length. The time slot cell and the entire table row will auto expand to accomodate the text. If no appoitnment is present for a given row, its height will be kept at minimum.

SOLUTION

The solution is achieved entirely with css:

.RadScheduler .rsMonthView .rsWrap,
    .RadScheduler .rsMonthView .rsApt,
    .RadScheduler .rsMonthView .rsAptOut,
    .RadScheduler .rsMonthView .rsAptIn,
    .RadScheduler .rsMonthView .rsAptMid,
    .RadScheduler .rsMonthView .rsAptContent
    {
            position: static !important;
            height: auto !important;
    }
    .RadScheduler .rsMonthView .rsWrap
    {
            overflow: hidden;
            font-size: 0;
            line-height: 0;
    }
    .RadScheduler .rsMonthView .rsLastWrap
    {
            height: 16px !important;
    }
    .RadScheduler .rsMonthView .rsAptContent
    {
            position: relative !important;
            border-top: 0;
            border-bottom: 0;
            left: 0;
            top: 0;
    }
    * html .RadScheduler .rsMonthView .rsAptIn
    {
            border-width: 0 1px;
            top: 0;
        margin-left: -1px;
        margin-right: -1px;
    }
    * html .RadScheduler .rsMonthView .rsAptMid
    {
            top: 0;
            left: 1px;
            margin: 0 1px;
            border-width: 1px 0;
    }

You can maintain mininum height for the appointments, by adding the following css:
.RadScheduler .rsMonthView .rsWrap,
.RadScheduler .rsMonthView .rsAptContent
{
    min-height: 25px;
}

LIMITATIONS:

This approach doesn't work for multi-day appointments (e.g. Appointments which start in one day and end in another).




Comments

If you'd like to comment on this KB article, please, send us a Support Ticket.
Thank you!

Please Sign In to rate this article.