Spiffy Plugins

I see what you need now. You could try hiding the first entry with this code:

li.spiffy-upcoming-day:nth-of-type(1) {
display: none;
}

The past events are shown in the full-size calendar. You can have the calendar toggle between the default grid and a list view, this is enabled on the options page. This is the only way to list past events at this time.

You can have your calendar default to the list view by adding the option to the page URL like this:

https://example.com/my-calendar?grid-list-toggle=list

I just checked your link and I see our calendar is not in use. Can you provide a link showing the issue you are having?

You could try playing around with flex display custom CSS to get your columns:

ul.spiffy.upcoming-events-list {
display: flex;
flex-wrap: wrap;
}

ul.spiffy.upcoming-events-list li {
display: inline-block;
margin: 10px 0 0 2%;
flex-grow: 1;
}

Looks like your quotes around the 4 don’t match properly.

You can just add this to your custom CSS rules:

.spiffy.cat-key { table-layout: auto; }

I don’t need to log in, just a link to the site showing the calendar would be helpful. If you don’t want to post it here you can use my contact form at https://spiffycalendar.spiffyplugins.ca/support/