[Solved] Setting Appointment Height to Cell Height

[Brad]

I'm trying to set the height of an appointment equal to the height of the cell in month view. 

Basically, I'm only going to have one appointment per day on a small calendar, so I want that appointment to cover the entire cell.  I've set the initial height of each appointment div (see below) so the size of the cell is not enlarged when the scheduler is loaded.  Is there a way to overwrite this size of an individual appointment by using the AppointmentDataBound event and a CSS Class?  

   .RadScheduler_Default .rsMonthView div.rsWrap
    {
      height: 7px;
    }

   .RadScheduler_Default .rsMonthView td.rsCell
    {
        width:25px;
        height:28px !important;
    }

I've already looked at the following articles but I did not find the answer there.

How to tweak the appearance of RadScheduler's cells

How to set the appointment's height to accomodate the entire subject's text in Month View

Thanks in advance!

[Peter]

Hello Brad,

Here is a KB article which will help you resolve the issue:
How to set the appointment's height to accomodate the entire subject's text in Month View 

Feel free to contact us if you have any other questions.


Best wishes,
Peter
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Brad]

Peter, Peter, Peter.  I know you're a busy guy, but if you'd have taken the time to read my complete post, you would've read the last part that said I had already been to that exact article you linked.  I couldn't quite get it to fit my needs, so that's why I came to support.

The correct answer would've been:

Set the height for the default appointment divs to a zero and then set the height of .rsApt to the height of the cell.  Pretty simple, but hopefully that'll help someone.

        .rsApt
        {
            height: 28px !important;
            cursor: default;
        }

        .RadScheduler_Default .rsMonthView td.rsCell
        {
            height: 28px !important;
            cursor: pointer;
        }

        .RadScheduler_Default .rsMonthView div.rsWrap
        {
          height:0px;
        }

        .RadScheduler_Default:hover
        {
            cursor: default;
        }

Now, can anyone tell me how to change the cursor when I hover above the date (the actual numbers) on each cell? 

In the above code I set the cursor to a pointer for each cell, but then each appointment is set to the default cursor.  That works fine, but when I hover over the numbers on the date of the appointment, the cursor changes back to default.  Any ideas on how I can override the entire cell with the cursor type of the appointment?

And Peter, please don't send me to one of those two KB articles.  :)

[Peter]

Apologies for this, Brad. The title of this thread is so precisely descriptive that it immediately rang a bell for me and I rushed to check the KB in question. Hopefully, I can tackle your other question about the cursor. The selector which affects the date in the table cell is the following:

 .rsRow .rsCell .rsDateWrap
      {
        cursor: pointer;
      }

Please, let me know if this helps or not.



All the best,
Peter
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Brad]

Attaboy, Peter!  You've redeemed yourself.  :)

That's what I needed.  Thanks!