试图创建一个大型菜单

Question

我正在开发css和jquery mega菜单。我希望我的菜单像大菜单。为此我也使用了一些css和jquery。我的css代码如下所示

#menu {
    position:relative;
}
#menu ul {
    list-style-type:none;
}
#menu .ddsmoothmenu {
    list-style:none;
    position:relative;
    //z-index:100;
    margin: 0;
}
ul#mm1.ddsmoothmenu{
}
#menu .ddsmoothmenu li > ul li > ul {
    margin-top:1px;
}
#menu .ddsmoothmenu li {
    position:relative;
    display:block;
    float: left;
    font-size:15px;
    margin-left:0;
    margin-bottom:0;
}
#menu .ddsmoothmenu li a {
    position:relative;
    display: block;
    color:#fff;
    text-decoration:none;
    padding:13.5px 34px 13px 34px;
    /* text-shadow:0 1px 1px #000; */
    /* border-left:1px solid #585858; */
}
#menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li a.selected, #menu li.current_page_item a {
    color:#000000;
    /* background:#343434 url(images/menutip.png) top center no-repeat; */
}

#menu li a:hover {
    color:#958177 !important;
    /* background:#343434 url(images/menutip.png) top center no-repeat; */
    background: none !important;
    border-bottom:3px solid #958177;
    height:15px; /* L */
}





#menu .ddsmoothmenu li > ul {
    margin-top:5px;
    background: none; /* L */
    /* background:url(images/menuarow.png) top no-repeat; */ /* L */
    margin:0;
}
#menu li li a, #menu li li a.selected, #menu li li a:hover {
    border:none;
}
#menu li.current-menu-item a:hover, #menu li.current-menu-parent a:hover, #menu li.current_page_parent a:hover, #menu li a:hover.selected {
    text-decoration:none;
    color:#fff;
}
#menu .ddsmoothmenu li.current-menu-item a, #menu .ddsmoothmenu li.menu-item-home a{
    margin-right:0;
}
#menu .ddsmoothmenu li li:first-child{
        //padding:0 1000em;
    //margin:0 -1000em;
    //position:absolute;
    left:0;

}
#menu .ddsmoothmenu li li {
    background: #eaebea;
    font:12px Arial, Helvetica, sans-serif!important;
    text-transform:capitalize;
    margin:0;
    padding:0;
}
#menu .ddsmoothmenu li li a {
    width:130px;
    height:auto;
    float:none;
    display:block;
    text-align:left;
    position:relative;
    margin:0;
    padding:10px 0;
    margin-left:18px;
    margin-right:18px;
    text-transform:capitalize;
    border-bottom:1px dotted #ccc;
    background: none; /* L */
   /*  background: url('images/arrow.png') no-repeat 0 14px; */ /* L */
    padding-left:10px;
    text-shadow:none;
    border-left:none;
    text-shadow:0 1.5px 1px #fff;
}
#menu .ddsmoothmenu li li:last-child{
    width:100%;
   /* padding-bottom:20px;  RD*/
}
#menu .ddsmoothmenu li li a:after {
    width:100%;
    content:'';
    position:absolute;
    left:0;
    top:0;
}
#menu .ddsmoothmenu li li li li:last-child a, #menu .ddsmoothmenu li li li li:last-child a:after {
    border-top:none;
    width:100%;
}
#menu .ddsmoothmenu li li:last-child a:after {
    width:100%;
    content:'';
    position:absolute;
    left:0;
    bottom:0;
}
* html #menu .ddsmoothmenu li li a {
    display:inline-block;
}
#menu .ddsmoothmenu li li a:link, #menu .ddsmoothmenu li li a:visited {
    color:#565555;
}
#menu .ddsmoothmenu li li a.selected, #menu .ddsmoothmenu li li a:hover {
    color: #CC0000;
    text-shadow:none;
}
#menu .ddsmoothmenu li ul {
    position:absolute;
    left:0;
    display:none;
    visibility:hidden;
}
#menu .ddsmoothmenu li ul li {
    display:list-item;
    float:none;
}
#menu .ddsmoothmenu li ul li ul {
    padding-top:0;
    background:none;
    top:0;
    margin-top:0;
    margin-left:0;
}
#menu .ddsmoothmenu li ul li ul li:first-child{
    padding-top:0;
}
* html .ddsmoothmenu {
    height:1%;
}

除了我的子菜单外，所有内容都将以全宽度查看。我遇到了这个问题。我的工作演示是：http://bassbrushes.diggsdev.com/blades/。我不知道如何显示子菜单全宽