FullCalendar - display full event title on calendar

Question

I'm using fullcalendar to display events, event titles are concatenated on the calendar and only show on one line, how can I display the full event title?

this is my bookings.js.coffee file which renders the calendar

$(document).on 'ready page:load', ->
  $('#calendar').fullCalendar
    editable: false,
    header:
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    defaultView: 'month',
    height: 500,
    slotMinutes: 30,

    eventSources: [{
      url: '/bookings',
    }],

    timeFormat: 'h:mm t{ - h:mm t} '

Answer 1

You can adjust the display of the title adding a css line:

   .fc-month-view span.fc-title{
         white-space: normal;
   }

I've created a plnkr where you can reproduce it