FullCalendar dividing lines between days

Question

I am using the jquery fullcalendar and it's working great however in the agendaweek view there are no dividing lines between the days. I have reviewed the fullcalendar site and even tried to find what css handled displaying the dividing lines with no luck. How do I get the day dividing lines to show?

Thanks

Answer 1

to add dividing lines between days

.fc-border-separate td {
    border-width: 1px 0 0 1px;
    border-color: red;
}

adjust pixels and color

Answer 2

I had the same issue in angular js (bower install), solved it with:

.fc-time-grid .fc-slats td {
    background: transparent;
}

Answer 3

I had the exact same issue using styling from http://jqueryui.com/themeroller/. If using themerolled calendar, try adding opacity to css class fc-agenda-slots td.

.fc-agenda-slots td {
    border-width: 1px 0 0;
    background: none;
    opacity:0.15;
 }

Answer 4

This is my solution.

$('.fc-timeGridWeek-button').click(function(){
    $(".fc-time").next("td").removeClass('fc-widget-content').addClass('fc-widget-skeleton');
});