Support

July 23, 2013 at 6:35 am

Hi Mending,

This is correct. The buttons across the width of the table will fill and not wrap the width of their container because of the way they are markup up. If you want to make the header of the calendar responsive there are settings in Event Espresso>Calendar that allow you to remove buttons. If you’d prefer to display more buttons on wider screens and remove or even wrap the buttons to a new row this can be done by adding a few style rules using the @media query in your custom stylesheet.

The following example will remove the today, Month, agendaDay, and agendaWeek buttons for screens smaller than 599px:

@media all and (max-width: 599px) {
  .fc-button-month,
  .fc-button-today,
  .fc-button-agendaDay,
  .fc-button-agendaWeek {
    display: none;
  }
}

July 23, 2013 at 8:27 am

This would cause issues for non-responsive themes. We can’t assume that all WordPress themes are using responsive media queries.

August 8, 2013 at 8:43 am

Are you looking to display events on Sunday? If not, you could hide the column for the breakpoint at that width with something like:

.fc-last {
display:none;
}