monthly event calendar html5 continuous css

Events that don't start or end in hidden areas are marked with *_event_continueleft and *_event_continueright classes.

Example from scheduler_white theme:

.month_white_event_inner 
{
  position: absolute;
  top: 0px;
  bottom: 2px;
  left: 2px;
  right: 2px;
  overflow:hidden;
  
  padding: 2px;
  padding-left: 5px;
  
  font-size: 12px;
  color: #666;
  background: #fff;
  background: -moz-linear-gradient(
    top,
    #ffffff 0%,
    #eee);
  background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#ffffff),
    to(#eee));
  filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#ffffff", endColorStr="#eeeeee");
  border: 1px solid #999;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow:
    0px 2px 3px rgba(000,000,000,0.3),
    inset 0px 0px 2px rgba(255,255,255,0.8);
  -webkit-box-shadow:
    0px 2px 3px rgba(000,000,000,0.3),
    inset 0px 0px 2px rgba(255,255,255,0.8);
  box-shadow:
    0px 2px 3px rgba(000,000,000,0.3),
    inset 0px 0px 2px rgba(255,255,255,0.8);
}

.month_white_event_continueright .month_white_event_inner {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  border-right-style: dotted;
}

.month_white_event_continueleft .month_white_event_inner 
{
  border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;	
  border-left-style: dotted;
}

See Also

Demo (ASP.NET MVC)