CODEWITHSUNDEEP
javascripthtmlcsscss-float
Peter Bridger
Peter Bridger

Reputation: 9323

Creating a calendar control using CSS: How to auto layout events

I'm creating a JavaScript based calendar control, which when showing a single day needs to list any events occuring. I'd like the use the CSS float:left in order to get the browser to automatically layout the events.

I'd like for the events to automatically stack, so that they float to the far left when possible. Then stack as if there is overlap with another event.

However I'm having problems, it currently looks like this:

alt text

This is the result I want to achieve:

alt text

How can I achieve this effect using float?

Upvotes: 0

Views: 1129

Answers (1)

Camilo Díaz Repka
Camilo Díaz Repka

Reputation: 4815

Have you tried using the "clear:both;" css style attribute to your block with the green element?

Also, you may find that an already created jQuery plugin like FullCalendar could serve your needs.

Upvotes: 1

Related Questions