jquery – 菜单>分为列和行,在打开子菜单时不起作用

我所拥有的是一堆< li>菜单项,其中一个打开< ul>子菜单.问题是,我无法让周围的< li>表现出来并在重新定位时考虑子菜单.

演示(点击’MISC’)：http://jsfiddle.net/6a3eZ/

它应该如何表现(我只能在下拉菜单项位于第三列时才能正常工作)：http://jsfiddle.net/6a3eZ/3/

这是我的CSS：

#menu {
    position:fixed;
    width:303px;
    margin: 62px 10px 0 0;
    padding:0;
    z-index:9999;
    right:0;
    BACkground:#EFEFEF;
    display:visible;

    -moz-Box-shadow:0px 0px 0px 0px rgba(0,0.55);
    -webkit-Box-shadow:0px 0px 0px 0px rgba(0,0.55);
    Box-shadow:0px 0px 0px 0px rgba(0,0.55);
}
.menu-active {
    display:block !important;
}

.menu {
    text-align:center;
    padding:0;
    margin:0;
}
.menu a {
    height:100px;
    color:#999;
    padding: 0;
    margin: 0 1px 1px 0;
    display:block;
    font-family:'Montserrat',arial,tahoma,verdana;
    font-weight: 700;
    cursor:pointer;
    BACkground:#fff;
}
.menu a:hover,.menu a:active {
    color:#fff;
    BACkground:#999;
    text-decoration:none;
}
.menu ul {

}
.menu li {
    float:left;
    list-style:none;
    margin:0;
    padding:0;
    z-index:-1;
    width:100px;
}
.menu li:first-child {
    border-top:none !important;
}
.menu li a {
    font-size:10px;
}
ul.sub-menu {
    list-style: none;
    margin:0 0 0 0;
    padding:0;
    width:300px;
}
.second ul.sub-menu {
    margin:0 0 0 -100px;
}
.sub-menu li {
    heigh:100px;
    float:left;
    list-style: none;
    margin:0;
    padding:0;
    BACkground:red;
    width:100px;
}
.sub-menu a {
    display:block;
    color:#888;
    margin:0;
    padding:0;
    height:100px;
}
.menu li.sub a {
    BACkground: url(images/menu-expandable.png);
    BACkground-position: right center;
    BACkground-repeat: no-repeat;
}
/* ReTina display .menu li.sub a */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min--moz-device-pixel-ratio: 1.5),only screen and (min-resolution: 240dpi)
{
.menu li.sub a { 
    BACkground: url(images/menu-expandable@2x.png);
    BACkground-position: right center;
    BACkground-repeat: no-repeat;
    BACkground-size: 18px 7px;
}
}
.menu li.sub a:hover {
}
.menu li.sub > ul a {
    BACkground-image: none;
    font-size:10px;
}