Text Wraps on Event Title

[GoogleCodeExporter]

What steps will reproduce the problem?

1.Used the following code hooked up to my Google Spreadsheet:

<div ex:role="view"
   ex:viewClass="Timeline"
   ex:start=".start"
   ex:end=".end"
   ex:topBandUnit="month"
   ex:bottomBandUnit="year"
   ex:topBandPixelsPerUnit="100"
   ex:bubbleWidth="500"
   ex:bubbleHeight="300"
   ex:colorKey=".eventType">
</div> 
2. Opened the timeline in Firefox and the event names automatically wrap to
another line, causing overlap.

What is the expected output? What do you see instead?
In Safari or Explorer, the text does not wrap, but in Firefox/3.0.11 the
text wraps and it causes events to visually overlap.

What version of the product are you using? On what browser and what
operating system? Using Mac OS Leopard and Firefox/3.0.11

Please provide any additional information below.

Original issue reported on code.google.com by saritaal...@gmail.com on 30 Jun 2009 at 12:42

[GoogleCodeExporter]

I fixed the label width for the events in css. 
However, once the text wraps, it overlaps with the text of the event below it, 
as shown in the image attached.
Can we avoid this overlap? I see that there is an instyle css for Top getting 
generated for each event label automatically. I am not sure where this is 
getting generated. Any clue??
Once this is known, we can alter the Top value to increment based on label 
height.

Original comment by ddivya.r...@gmail.com on 27 Dec 2010 at 5:37

Attachments:

• timelineErr.bmp

[GoogleCodeExporter]

Original comment by ryan...@csail.mit.edu on 23 Jun 2011 at 9:41

• Added labels: Project-Exhibit, Project-Timeline

[GoogleCodeExporter]

Original comment by ryan...@csail.mit.edu on 23 Jun 2011 at 10:31

• Removed labels: Project-Timeline

[GoogleCodeExporter]

this looks ancienct, but is there a fix for this issue? I'm experiencing it 
right now with a bunch of student projects. Thanks!

Original comment by mopto...@gmail.com on 6 Nov 2012 at 5:35

[GoogleCodeExporter]

Can you add clarification?  Are you seeing this problem on all browsers?  Only 
old ones?  (Original bug post said only firefox was a problem).  Which version 
of timeline are you using?  Can you post links to examples?

Original comment by david.ka...@gmail.com on 6 Nov 2012 at 5:44

[GoogleCodeExporter]

Yes, I'm seeing this on all browsers.  I have put a test example online on 
jbin: 
http://jsbin.com/elukij/3

Oddly, the txt doesn't seem to wrap when jsbin is in edit mode: 
http://jsbin.com/elukij/3/edit

Looking at my code, I may be using an obsolete URL to load timeline: 
http://simile.mit.edu/timeline/api/timeline-api.js

Should I be using 
http://api.simile-widgets.org/timeline/2.3.1/timeline-api.js?bundle=true
instead?  Sorry, I may have been following obsolete doumentation when I wrote 
the sample code.  With 2.3.0 (or i it 2.3.1?) the text seems to wrap properly.  
But now the events aren't displaying properly in the ower band, where they seem 
to overlap in a single layer, rather than stagger:
http://jsbin.com/ijuhap/2

I'm hesitant to recommend this solution to my students until that second issue 
is fixed -- any suggestions?  Thanks!
matt

Original comment by mopto...@gmail.com on 7 Nov 2012 at 8:53

[GoogleCodeExporter]

(sory for the typos in that last comment, sticky keys and a late post-election 
night!)

Original comment by mopto...@gmail.com on 7 Nov 2012 at 9:55