By default, the row height in DayPilot Scheduler is determined by the EventHeight property and the maximum number of overlapping events in the row. That means that when you add new concurrent events the height will increase automatically.

Single Event

dps-row-basic141x58.png

Two Overlapping Events

dps-row-extended205x77.png

Row Margin

You can specify the bottom row margin (in pixels):

1. Global setting: RowMarginBottom, RowMarginTop properties of the Scheduler

2. Per row - MarginBottom property of the Resource object.

dps-row-marginbottom151x124.png

Minimum Row Height

You can specify the minimum row height globally using RowMinHeight property (in pixels) or per row using MinHeight property of the Resource object.

dps-row-minheight145x79.png

ASP.NET WebForms

<DayPilot:DayPilotScheduler runat="server" id="DayPilotScheduler1"
  ...
  RowMinHeight = "60"
/>

ASP.NET MVC

You can adjust the row height manually using Resource properties.

@Html.DayPilotScheduler("dps_rowheadercolumns", new DayPilotSchedulerConfig {
  BackendUrl = ResolveUrl("~/Scheduler/Backend"),
  Resources = new ResourceCollection {
    new Resource("Room B", "B"),
    new Resource{Name = "Room C", Id = "C", MinHeight = 60 },
    new Resource{Name = "Room D", Id = "D", MarginBottom = 5 },
  }
})

Minimum Row Height 

scheduler-row-minheight.png

MinHeight = 60

Bottom Margin

scheduler-row-marginbottom.png

MarginBottom = 5

Demo

JavaScript

Use rowMinHeightrowMarginTop, and rowMarginBottom properties.

<div id="dp"></div>
<script type="text/javascript">
  var dp = new DayPilot.Scheduler("dp");
  dp.rowMinHeight = 60;
  // ...
  dp.init();
</script>

You can specify custom .eventHeight value for the rows with no events. This will set the row height accordingly.

dp.resources = [
  { name: "Group1", id:"G1", eventHeight:20}
];