Menu running into 2 lines in INternet Explorer
<p>I have a menu omn the <a href="http://berrisford.gumpshen.com/" rel="nofollow">http://berrisford.gumpshen.com/</a> that works out the padding for the menu items using the following javascript.</p>

<p>This works fine in FIrefox but in IE the menu items become too long and the last menu item spills onto a new line. Can anyone help please?</p>

<pre><code>var finalWidth = 940;
var totWidth = 0;

var lis = $("header ul.lv1 &gt; li").each(function () {
    totWidth += $(this).width();
});

var diff = finalWidth - totWidth;
var diffPer = diff / lis.length;

if (diff &gt; 0) {
    $("header ul.lv1 &gt; li a").each(function () {
        $(this).css('padding-right', diffPer / 2);
        $(this).css('padding-left', diffPer / 2);
    });

    var totWidth2 = 0;
    var lis2 = $("header ul.lv1 &gt; li").each(function () {
        totWidth2 += $(this).width();
    });



    if ($.browser.msie) {
        var version = parseInt($.browser.version, 10);

        if (version &lt; 9) {
            $("header ul.lv1 &gt; li a").last().css('padding-right', (940 - totWidth2) - 20);
            var lastItemPaddding = (Math.floor(diffPer / 2) + (940 - totWidth2));
            $("header ul.lv1:last-child li:last-child a").css('padding-right', lastItemPaddding);
        }
    }
    else {
        var version = parseInt(detectBrowserVersion(), 10);

        if (version == 14) {

            $("header ul.lv1 &gt; li a").last().css('padding-right', (940 - totWidth2) - 20);
            var lastItemPaddding = (Math.floor(diffPer / 2) + (940 - totWidth2));
            $("header ul.lv1:last-child li:last-child a").css('padding-right', lastItemPaddding);
        }
    }
}
</code></pre>

<p><a href="http://berrisford.gumpshen.com/" rel="nofollow">http://berrisford.gumpshen.com/</a></p>
