CSS Menu如何才能在谷歌浏览器中显示正常 _HTML/CSS

CSS Menu怎么才能在谷歌浏览器中显示正常
怎么才能在谷歌浏览器中显示正常，在IE9显示也不正常，其他浏览器显示正常。
不正常的
正常的
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
   
        .cn_menu
        {
            width: 170px;
            overflow: visible;
        }
        .jtkh
        {
            background: url(images/jtkh.jpg) no-repeat left top;
            text-indent: 35px;
            float: left;
            line-height: 32px;
            font-weight: normal;
            text-align: left;
            width: 100%;
            overflow: hidden;
            margin: 1px 0 0 0;
            font-weight: bold;
        }
        .jtkh.on1, .jtkh.on1 a
        {
            background: url(images/jtkh.jpg) no-repeat left -32px;
            line-height: 32px;
            color: #15428B;
        }
        .jtkh a
        {
            width: 100%;
            color: #15428B;
            text-decoration: none;
            float: left;
            font-family: 宋体;
            font-size: 12px;
        }
        .jtkh a:hover
        {
            background: url(images/jtkh.jpg) no-repeat left -32px;
            line-height: 32px;
            color: #15428B;
            font-family: 宋体;
            font-size: 12px;
        }
        .jtkh.on1 li
        {
            background: url(images/cn_menu_li.gif) no-repeat left top;
            height: 30px;
            text-indent: 30px;
            font-weight: normal;
            color: #666666;
            margin: 0;
            line-height: 30px;
        }
        .jtkh.on1 li.on
        {
            background: url(images/cn_menu_li.gif) no-repeat left -30px;
        }
        .jtkh.on1 li.on a
        {
            color: #333333;
            background: url(images/cn_menu_li.gif) no-repeat left top;
        }
        .jtkh.on1 li a
        {
            line-height: 30px;
            color: #666666;
            background: url(images/cn_menu_li.gif) no-repeat left top;
        }
        .jtkh.on1 li a:hover
        {
            background: url(images/cn_menu_li.gif) no-repeat left -30px;
            color: #333333;
            line-height: 30px;
            font-weight: normal;
        }
        .grkh
        {
            background: url(images/grkh.jpg) no-repeat left top;
            text-indent: 35px;
            float: left;
            line-height: 32px;
            font-weight: normal;
            text-align: left;
            width: 100%;
            overflow: hidden;
            margin: 1px 0 0 0;
            font-weight: bold;
        }
        .grkh.on2, .grkh.on2 a
        {
            background: url(images/grkh.jpg) no-repeat left -32px;
            line-height: 32px;
            color: #15428B;
        }
        .grkh a
        {
            width: 100%;
            color: #15428B;
            text-decoration: none;
            float: left;
        }
        .grkh a:hover
        {
            background: url(images/grkh.jpg) no-repeat left -32px;
            line-height: 32px;
            color: #15428B;
        }
        .grkh.on2 li
        {
            background: url(images/cn_menu_li.gif) no-repeat left top;
            height: 30px;
            text-indent: 30px;
            font-weight: normal;
            color: #666666;
            margin: 0;
            line-height: 30px;
        }
        .grkh.on2 li.on
        {
            background: url(images/cn_menu_li.gif) no-repeat left -30px;
        }
        .grkh.on2 li.on a
        {
            color: #333333;
            background: url(images/cn_menu_li.gif) no-repeat left top;
        }
        .grkh.on2 li a
        {
            line-height: 30px;
            color: #666666;
            background: url(images/cn_menu_li.gif) no-repeat left top;
        }
        .grkh.on2 li a:hover
        {
            background: url(images/cn_menu_li.gif) no-repeat left -30px;
            color: #333333;
            line-height: 30px;
            font-weight: normal;
        }
        .jcda
        {
            background: url(images/left7.jpg) no-repeat left top;
            text-indent: 35px;
            float: left;
            line-height: 32px;
            font-weight: normal;
            text-align: left;
            width: 100%;
            overflow: hidden;
            margin: 1px 0 0 0;
            font-weight: bold;
        }
        .jcda.on3, .jcda.on3 a
        {
            background: url(images/left7.jpg) no-repeat left -32px;
            line-height: 32px;
            color: #15428B;
        }
        .jcda a
        {
            width: 100%;
            color: #15428B;
            text-decoration: none;
            float: left;
        }
        .jcda a:hover
        {
            background: url(images/left7.jpg) no-repeat left -32px;
            line-height: 32px;
            color: #15428B;
        }
        .jcda.on3 li
        {
            background: url(images/cn_menu_li.gif) no-repeat left top;
            height: 30px;
            text-indent: 30px;
            font-weight: normal;
            color: #666666;
            margin: 0;
            line-height: 30px;
        }
        .jcda.on3 li.on
        {
            background: url(images/cn_menu_li.gif) no-repeat left -30px;
        }
        .jcda.on3 li.on a
        {
            color: #333333;
            background: url(images/cn_menu_li.gif) no-repeat left top;
        }
        .jcda.on3 li a
        {
            line-height: 30px;
            color: #666666;
            background: url(images/cn_menu_li.gif) no-repeat left top;
        }
        .jcda.on3 li a:hover
        {
            background: url(images/cn_menu_li.gif) no-repeat left -30px;
            color: #333333;
            line-height: 30px;
            font-weight: normal;
        }
    </style>

    <script type="text/javascript">
       
        function SwitchMenu(obj) {
            var el = document.getElementById(obj);
            var ar = document.getElementById("masterdiv").getElementsByTagName("ul");
            if (el.style.display != "block") {
                for (var i = 0; i < ar.length; i++) {
                    ar[i].style.display = "none";
                }
                el.style.display = "block";
            }
            else {
                el.style.display = "none";
            }
            //设置on样式
            if (obj == "sub1") {
                $("li[name^='li_']").removeClass("on5");
                $("li[name='li_" + obj + "']").addClass("on3");
                $("li[name='li_" + obj + "']").addClass("on4");
                $("li[name^='li_']").removeClass("on2");
                $("li[name='li_" + obj + "']").addClass("on1");
            }
            if (obj == "sub2") {
                $("li[name^='li_']").removeClass("on1");
                $("li[name^='li_']").removeClass("on5");
                $("li[name='li_" + obj + "']").addClass("on3");
                $("li[name='li_" + obj + "']").addClass("on4");
                $("li[name='li_" + obj + "']").addClass("on2");
            }
            if (obj == "sub3") {
                $("li[name^='li_']").removeClass("on1");
                $("li[name^='li_']").removeClass("on5");
                $("li[name='li_" + obj + "']").addClass("on2");
                $("li[name='li_" + obj + "']").addClass("on4");
                $("li[name='li_" + obj + "']").addClass("on3");
            }

        }
    </script>

</head>
<body>

    <div id="div_left" class="cn_menu" runat="server">
        <ul id="masterdiv" style="margin-left: 0px; margin-bottom: 0px">
            <li id="lii_1" name="li_sub1" runat="server" class="jtkh"><a href="#" onclick="SwitchMenu('sub1')">
                集体考核</a>
                <ul id="sub1" style="display: none; margin-left: 0px;">
                    <li id="li_1" runat="server"><a href="#" target="_self">绩效考核</a></li>
                    <li id="li_2" runat="server"><a href="#" target="_self">得分对比分析</a></li>
                    <li id="li_3" runat="server"><a href="#" target="_self">得分统计分析</a></li>
                    <li id="li_4" runat="server"><a href="#" target="_self">查询考核记录</a></li>
                </ul>
            </li>
            <li id="lii_2" name="li_sub2" runat="server" class="grkh"><a href="#" onclick="SwitchMenu('sub2')">
                个人考核</a>
                <ul id="sub2" style="display: none; margin-left: 0px;">
                    <li id="li_6" runat="server"><a href="#" target="_self">绩效考核</a></li>
                    <li id="li_7" runat="server"><a href="#" target="_self">得分对比分析</a></li>
                    <li id="li_8" runat="server"><a href="#" target="_self"> 得分统计分析</a></li>
                    <li id="li_9" runat="server"><a href="#" target="_self">查询考核记录</a></li>
                </ul>
            </li>
              <li id="lii_3" name="li_sub3" runat="server" class="jcda"><a href="#" onclick="SwitchMenu('sub3')">考核设定</a>
                <ul id="sub3" style="display: none; margin-left: 0px;">
                    <li id="li_11" runat="server"><a href="#" target="_self">考核表管理</a></li>
                    <li id="li_12" runat="server"><a href="#" target="_self">添加考核项目</a></li>
                    <li id="li_13" runat="server"><a href="#" target="_self">修改考核项目</a></li>
                    <li id="li_14" runat="server"><a href="#" target="_self">附加分管理</a></li>
                </ul>
            </li>
        </ul>
    </div>

</body>
</html>