Zurb foundation 基金会6 我正在看新的网站6。我已经建立了一个反应灵敏的顶栏，在小型设备上结合手风琴，在中型和以上设备上结合下拉菜单

我的问题是，我不知道如何在顶栏下显示子菜单，而不是在菜单项的右侧

有人有主意吗？我不知道从哪里开始。提前感谢：）

我附加了我的HTML和SCS

///显示完整菜单的媒体查询
///@type字符串
$topbar断点：中等！违约
//导航背景
$导航背景：$白色；
$navigation字体颜色：$primary color；
$navigation字体悬停颜色：$white；
$navigation边框底部高度：4px；//相应地调整$navup桌面高度/$navup移动高度
$navigation边框底部类型：实心；//点、双、实、虚线
$导航边框底色：$中灰色；
$navigation菜单项background active:缩放颜色（$primary color，
$lightness:90%）；
///标志栏
$logo高度桌面：2rem；
$logo padding desktop:$global margin；
$logo-bar-background:$navigation-background；
//导航
$navup移动高度：113px；
$navup桌面高度：132px；
$桌面导航背景：$导航背景；
$桌面子菜单背景悬停：$导航背景；
$desktop-submenu-level1-background:缩放颜色（$desktop导航背景，
$lightness:0%）；
$desktop-submenu-level2-background:缩放颜色（$desktop导航背景，
$lightness:0%）；
$desktop-submenu-level3-background:缩放颜色（$desktop导航背景，
$lightness:0%）；
$desktop-submenu-level4-background:缩放颜色（$desktop导航背景，
$lightness:0%）；
$desktop-submenu-level5-background:缩放颜色（$desktop导航背景，
$lightness:0%）；
$desktop子菜单边框：1px纯色$navigation字体颜色；
$desktop菜单有子菜单填充：1.5rem 1.5rem 1.5rem 1rem；
$desktop菜单填充：1.5rem；
//Vars：桌面菜单项边框
$桌面菜单项边框底部：$导航边框底部高度$导航边框底部类型$深灰色；
$桌面菜单项边框底部隐藏：$导航边框底部高度$导航边框底部类型$导航背景；
$桌面菜单项边框底部悬停：$导航边框底部高度$导航边框底部类型$导航字体颜色；
//Vars：桌面菜单项处于活动状态（边框和背景）
$desktop菜单项后台活动：无；
$桌面菜单项边框底部活动：$导航边框底部高度$导航边框底部类型$导航字体颜色；
$移动导航背景：$导航背景；
$mobile子菜单填充：1.5rem；
$mobile子菜单background:$navigation background；
$mobile-submenu-level1-background：缩放颜色（$mobile-submenu-background，
$lightness:-0%）；
$mobile-submenu-level2-background：缩放颜色（$mobile-submenu-background，
$lightness:-0%）；
$mobile-submenu-level3-background：缩放颜色（$mobile-submenu-background，
$lightness:-0%）；
$mobile-submenu-level4-background：缩放颜色（$mobile-submenu-background，
$lightness:-0%）；
$mobile-submenu-level5-background：缩放颜色（$mobile-submenu-background，
$lightness:-0%）；
$mobile子菜单背景悬停：缩放颜色（$mobile导航背景，
$lightness:-5%）；
$mobile子菜单字体颜色悬停：$white；
$mobile菜单项background active:$navigation菜单项background active；
$菜单按钮背景：$白色；
$菜单按钮颜色：$原色；
$menu按钮填充：1rem；
$menu按钮大小：49px；
header.navigation-custom{
长方体阴影：0px 0px 8px 0 rgba（$黑色，.2）；
位置：固定；
宽度：100%；
背景：$导航背景；
z指数：1001；
排名：0；
过渡：顶部。3s轻松进出；
边框底部：$导航边框底部高度$导航边框底部类型$原色；
@包括断点（$topbar断点）{
边框底部：$导航边框底部高度$导航边框底部类型$导航边框底部颜色；
}
//手机造型
//菜单样式
.顶栏{
背景：无；
z指数：99999；
底部：0；
////子菜单嵌套
//顶级
.菜单{
保险商实验室{
背景：无；
}
李{
背景：$移动子菜单背景；
&.menu-item.active{
背景：$移动菜单项背景激活；
}
&：悬停{
背景：$移动子菜单背景悬停；
}
}
//填充物
李：不是（.menu text）>a{
填充：$移动子菜单填充；
&：：之后{
右：1.5雷姆；
}
}
//一级
.子菜单.嵌套{
文本缩进：1rem；
李{
背景：$mobile-submenu-level1-background；
&：悬停{
背景：$移动子菜单背景悬停；
}
a{
&：：之后{
文本缩进：0；
}
}
&：第一个孩子{
框阴影：$global box shadow inset；
}
}
//二级
.子菜单.嵌套{
文本缩进：1.5rem；
李{
背景：$mobile-submenu-level2-background；
&：悬停{
背景：$移动子菜单背景悬停；
}
}
//三级
.子菜单.嵌套{
文本缩进：2rem；
李{
背景：$mobile-submenu-level3-background；
&：悬停{
背景：$移动子菜单背景悬停；
}
}
//四级
.子菜单.嵌套{
文本缩进：2.5rem；
李{
背景：$mobile-submenu-level4-background；
&：悬停{
背景：$移动子菜单背景悬停；
}
}
//五级
.子菜单.嵌套{
文本缩进：3rem；
李{
背景：$mobile-submenu-level5-background；
&：悬停{
巴克