Html 在嵌套菜单中，如何使子菜单100%向左对齐？

以下是基本菜单：

JS-Bin

家

我们的员工

乔恩·斯基特
蜘蛛侠


联系我们

body，ul，li，a{
保证金：0；
填充：0；
}
a{
光标：指针；
}
.导航{
列表样式：无；
宽度：100%；
显示：表格；
}
李国荣先生{
显示：表格单元格；
背景：红色；
}
.导航a{
显示：块；
文本对齐：居中；
填充：10px；
}
.pos-fix{
位置：相对位置；
}
.导航a:以前{
内容：''；
显示：内联块；
高度：30px；
宽度：30px；
背景：url(http://placehold.it/30x30);
浮动：左；
保证金：-5px0；
}
.导航a:悬停{
背景：黑色；
颜色：黄色；
}
.nav li:悬停垂直{
显示：块；
}
维特先生{
显示：无；
宽度：100%；
位置：绝对位置；
}
李维特先生{
宽度：100%；
显示：块；
}

让我们看看子菜单（我们的员工/约翰·斯基特·蜘蛛侠）。如何将它们设置为100%宽度并向左对齐？ 到目前为止，我试图使它

宽度：10000px；溢出：隐藏但仍会显示水平滚动条。甚至
位置：绝对；左：0拧紧所有螺钉
执行以下操作：

 ul.nav .pos-fix {
        left: 0;
        margin: 0;
        position: absolute;
        right: 0;
    }

您的
pos-fix
div导致了问题。移除它


（相关）CSS
 ul.nav .pos-fix {
        left: 0;
        margin: 0;
        position: absolute;
        right: 0;
    }

.vert {
    display: none;
    width: 100%;
    position: absolute;
    top: 40px;
    left:0;
}
.vert li {
    width: 100%;
    display: block;
    text-align: left;
}
.vert a {
    text-align: left;
}
.vert a:before {
    margin-right: 10px;
}