等宽菜单项动态生成且符合浏览器要求

Question

我正在创建一个导航菜单，其中每个菜单项的宽度都必须相等，总宽度为970px。项目数量将是动态的（有时为6、7或5）。我遇到的主要问题是我目前的方法：

$(document).ready(function () {
    // Navigation Tab Width Calculation
    var nCnt = $("#nav > li").length;
    var navConstraint = 970 - (nCnt - 1);
    var nWidth = navConstraint / nCnt;
    //// Sets Distributed Width of items
    $("#nav > li > a").css({ "width": nWidth + "px" });
    //// Sets Width of ul in submenus
    $("#nav ul").css({ "width": nWidth + "px" });
    //// Sets Width of li in submenus
    $("#nav ul li").css({ "width": nWidth + "px" });
    //// Sets Width of a tags in submenus width an adjustment for padding
    $("#nav ul li a").css({ "width": nWidth - 10 + "px" });
    /// Width Fixes for first and last nav elements
    $("#nav > li:first").css({ "margin-left": "0px" });
    //// Fixes the last item to fit the stock image width, by browser if necessary
    var lastOffset = 1;
    $("#nav > li a:last").width(nWidth - lastOffset);
    //// Adds Vertical Centering for Menu Items
    $("#nav").children("li").each(function () {
            var nh = ($(this).find("a").find(".navText").height());
            if (nh < 20) {
                    $(this).find(".navTextPadder").height(11);
            }
            else {
                    $(this).find(".navTextPadder").height(7);
            }
    }); 

我遇到的问题是IE浏览器不能很好地处理宽度，不确定它们是否不能处理十进制宽度，但它比FF中的短，这非常精确。有更好的方法吗？

Answer 1

使用Math.floor或其他方法对数字进行四舍五入。

另一种方法是使用一个好的旧表：

<table width="100%">
  <tr>
    <td>content</td>
    <td>content</td>
    <td>content</td>
  </tr>
</table>