Word breaking…

[rodneyrehm]

This has been reported via mail by Lynne:

fiddle to play with

Left: Firefox 16 Mac, Right: IE9 Win7

Left: Firefox 16 Mac, Right: Firefox 16 Win7

proposed solution was

/*  around line 1090 */

// determine widths of submenus, as CSS won't grow them automatically
// position:absolute > position:absolute; min-width:100; max-width:200; results in width: 100;
// kinda sucks hard...
opt.$menu.find('ul').andSelf().css({position: 'static', display: 'block'}).each(function(){
    var $this = $(this);
    $this.width($this.css('position', 'absolute').width() + 1)
        .css('position', 'static');

(adding a single pixel to the width returned) the wrap problem disappeared. I am not sure why the problem occurs but have read that IE9 may calculate widths to sub pixel resolution and perhaps width() is rounding? I have found that adding the single pixel corrects the problem in IE 9 without seriously affecting the appearance in FF.