More than 4 events in day-view cause broken view

[erniomaldo]

Hi there, i have a problem when try to represent multiples events in a same date and time as you can see in the next picture: Note that this image have dummy info(not production database), but this occours too in the production site, all the envents begin at the same hour, suggestions?

Thanks =)

[aoyoo111]

Did you solve it?

[Romuald2014]

There is a blunt solution: change the max-width in #cal-day-box .day-event ( in calendar.css ). But I expect something more elegant(

[cablegunmaster]

Solution #1 make divs of every hour and radically change how the calendar works. in my own version I have changed this radically, I didn't want the 'overlay' onto next hours, so I put it on 1 div and made it when more events are there it just only appear on 1 hour. Solution #2 change the max-width like romuals2014 says, which allows to put it on 1 row. Solution #3 get creative with CSS change it so it has some partial overlay, when entering a second item, like have a offset on the newly created item, but you have to make sure a maxwidth is set, that is what the initial calendar didn't do, you get scrolling bars on the bottom of the calendar but at least it is on the hour you wanted it on.

[Patrick-W-McMahon]

Another solution would be if the number of events is more than 4 then display some kind of 'more' button or some kind of extending the data. much like how google does it. If it showed a card like layout to visually show there are many then when clicking on the card stack bring up a list of the events.