sIFR moving a word into two lines?

Answer 1

sIFR calculates the dimensions of the element you're applying it to. Floated elements are shrinkwrapped and take up only the width in which its necessary for the text inside to display.

I suggest you give an id to each of those lis, something like

li#nav-blog { width:200px; }

This will give you finer control over how much area each of those nav list elements take up, and more space for sIFR to use.

Answer 2

sIFR is limited in width to the width of the element you're replacing. If this element is floated, the width is the actual width of the HTML text. If the Flash font is wider than the HTML font, this means the Flash text won't fit in the allowed width and splits into multiple lines.

Possible solutions:

• Specify letter-spacing for the list items, such that the HTML text is as wide as the Flash text
• Set forceSingleLine parameter for sIFR.replace() to true, with as downside that the Flash movies will show horizontal resizing as they are initialized
• Combine the two solutions to get better initialization performance, and the security that the text will never split