FullCalendar事件显示为细线

Question

I use FullCalendar Plugin from this website and I use this Calendar in a Bootstrap modal and the same Calendar in the main content of the page. Although in the main content of my page the calendar events are showing pretty well, but in the modal events are showing as very thin lines as picture below. I have tried to style them with CSS and the result was to resize event boxes but the titles never showed up

.fc-event {
  min-height: 25px;

}

The JQuery code to render the calendar is the below and the events come from a servlet as json

$('#calendar').fullCalendar({
        header: {
            center: 'title',
            left: '',
            right: '',

        },
        events: src

        ,
        eventClick: function (calEvent) {
            viewEvent(calEvent.id);
            $('#aModal').modal();
        },
        // put your options and callbacks here
    });

Answer 1

.fc-content span{



    display:block;
}

Event details are displaying as spans so display block