Drag and drop into div

I have been wondering if there is a way to drag and drop objects with different widths into div, so they will not impose on each other.

Let's say I have two divs and 5 objects. By div I mean something like timeline with one column for each 5 minutes. And objects are films, each film has his length, obviously. What I want is to drag these films and drop them into my timeline.

Sorry, English is not my native language. I made a picture, might help you understand my question.

Here it is: http://ift.tt/1A6Ve27

P.S. I'm using ember.js, so if it has her own plugins or ways to do it, I would like to know.

Thanks!